标签: css-selectors

我一直在使用webscraping XML::readHTMLTable,现在我正在努力学习如何在更细微的层面上进行搜索.我的动机来自于尝试在多个日子里在网站上刮一张桌子来改变位置(例如,昨天它是页面上的第4个表格,今天它是页面上的第2个表格,等等).我将使用一个以各种体育赛事发布维加斯赔率的网站为例,我将特别试图提取NBA数据.

URL1 = "http://www.scoresandodds.com/grid_20161123.html"
URL2 = "http://www.scoresandodds.com/grid_20161125.html"

你会注意到NBA桌子是第一张桌子URL1,它是第二张桌子URL2.认识到NBA是第一个表格,以下是我如何将其作为第一个网址:

library(XML)

URL1 = "http://www.scoresandodds.com/grid_20161123.html"
exTable = readHTMLTable(URL1)[[1]] %>%
# Find first blank, since NBA is the first table #
  head(which(exTable[,1] == "")[1] - 1)

然后我会从那里清理它.我知道这不是最好的方法,甚至考虑到我想要循环多天,因为需要进行所有的清洁.学习如何抓取网页表中的特定对象会更好.

我已经玩了rvest一些,我知道我可以为Vegas线获得看起来像"td.line"的节点,但是我试图选择特定表格的节点(css = "#nba > div.sport"或其他东西？).我不一定想要这个具体例子的答案,但学习如何做这个例子将允许我将技能应用于许多其他情况.在此先感谢您的帮助.

我在渲染的HTML页面中有两个案例.

情况1:

<ul>
  <li>A</li>
  <li>B</li>
</ul> 
<div class="test">Testing here</div>

案例2:

<ul></ul>
<div class="test"></div>

在案例1中,我想申请CSS到div,如果ul元素包含li元素).我不想要任何案例2.我想要一个没有任何jQuery/JavaScript的纯CSS方法.

我希望在每10个div元素之后隐藏第4个div元素.那么如何使用nth-of-typeOR或任何其他风格的CSS.

任何人都有我的问题的想法然后请更新我.

我有以下HTML和CSS代码,也可以在这里找到并播放//jsfiddle.net/0k1qah6x/7/

我的意图是数字"1",其中"活跃"类不是红色.

.pdf-pagination a:not(.active) {
  color: red;
  text-decoration: none;
}

<div class="pdf-pagination">
  <ul>
    <li class="disabled">
      <a id="pdfPaginationLink0" href="#" data-page="0">?</a>
    </li>
    <li class="active">
      <a id="pdfPaginationLink1" href="#" data-page="1">1</a>
    </li>
    <li>
      <a id="pdfPaginationLink2" href="#" data-page="2">2</a>
    </li>
    <li>
      <a id="pdfPaginationLink3" href="#" data-page="2">?</a>
    </li>
  </ul>
</div>

我正在使用代码

footer h1,h2,h3,h4,h5,h6{
  color: #fff;
  margin: 10px auto;
}

选择页脚内的所有h标签.有一个HTML标签页脚,如果我没有弄错,我的代码应该只选择页脚标签内的那些h1,h2,h3,h4,h5,h6标签.但令人惊讶的是,当我测试我的代码时,它会选择页脚标记之外的所有其他h1,h2,h3,h4,h5,h6标记!

怎么可能？有什么我想念的吗？

我有ul列表项目,我希望它们的样式如下图.有没有办法通过使用css nth-child选择器或通过仅使用css的任何其他方式来设置它.

ul, ol {
  list-style: none;
  padding: 0;
}
li {
  text-align: center;
  line-height: 2;
  background: slategrey;
  border:1px solid white;
}
li:nth-child(1) {
  background: lightsteelblue;
}

<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
    <li>Six</li>  
    <li>Seven</li>
    <li>Eight</li>
    <li>Nine</li>
    <li>Ten</li>
    <li>Eleven</li>
    <li>Twelve</li>
    <!--There may be more list items -->
  </ul>

以下是元素描述:

<div class="css-control-textinput-122aa"><input type="text" aria-required="true" disabled="" required=""</div>

在上面的类中有名称css-control-textinput-122aa,但这里122aa没有固定值,它会被更改.那么如何才能使用仅className从头开始查找元素css-control-textinput？

在我尝试的代码下面,但它不起作用:

@FindBy (className = "css-fauxcontrol-textinput-^")
List<WebElement> dataSourceName;

我正在对导航菜单的最后一个子元素进行样式设置，似乎可以使用以下代码来做到这一点：

.aston-menu-light ul > li:last-child {
    border:2px solid blue;
    border-radius: 50px;
    padding:0 20px 0 20px;
} 

.aston-menu-light ul > li > ul > li:last-child {
    border:none !important;
    padding:0 !important;
} 

.aston-menu-light ul > li:last-child:hover {
    background-color:#ffff;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
} 

当我尝试将<a>鼠标悬停在最后一个孩子上时，麻烦就来了。我正在使用这个：

.aston-menu-light ul > li > a:last-child:hover {
    color:red !important;
} 

但这似乎为所有<a>标签加上了样式，而不仅仅是最后一个孩子。我已经尝试过各种变体，例如：ul > li a但我似乎无法正常工作。

我在这里有一个Codepen：https ://codepen.io/shaun-taylor/pen/LXdGGN

我的主要目标是，将鼠标悬停在顶级链接上时，仅将其上的最后一个链接变为红色，谢谢您的阅读！

我想根据祖先不存在的另一个类来设置一个类的样式。

div:not(.evil-class) .element {
  background-color: green;
}

<div class="evil-class">
  <div class="element">An element within the evil class</div>
</div>

<div class="element">An element NOT in the evil class</div>

不确定为什么不起作用？

我知道我可以做相反的事情。对两个元素都应用样式，然后覆盖该样式，但是我不愿意这样做，因为我将覆盖可能在第三方库中更改的样式。

谢谢。

我有一个作业，必须在不触摸html的情况下对页面进行样式设置。ID中以“＃”开头的两个ID名称是否有办法让我使用ID在CSS文件中选择它们？