相关疑难解决方法(0)

如何选择<li>作为锚元素直接父元素的元素？

在示例中,我的CSS将是这样的:

li < a.active {
    property: value;
}

显然有一些方法可以使用JavaScript来实现这一点,但我希望CSS Level 2本身存在某种解决方法.

我尝试设置样式的菜单正在由CMS喷出,因此我无法将活动元素移动到<li>元素...(除非我主题菜单创建模块,我宁愿不这样做).

有任何想法吗？

加号(+)用于下一个兄弟.以前的兄弟姐妹是否有同等效力？

CSS选择器由浏览器引擎从右到左匹配.因此,他们首先找到孩子,然后检查他们的父母,看看他们是否符合规则的其余部分.

1. 为什么是这样？
2. 是因为规范说的吗？
3. 如果从左到右进行评估,它是否会影响最终布局？

对我来说,最简单的方法是使用元素数量最少的选择器.首先是ID(因为它们应该只返回1个元素).然后可能是类或具有最少节点数的元素 - 例如,页面上可能只有一个跨度,因此可以使用引用跨度的任何规则直接到达该节点.

以下是备份我的说法的一些链接

1. http://code.google.com/speed/page-speed/docs/rendering.html
2. https://developer.mozilla.org/en/Writing_Efficient_CSS

这听起来像这样做是为了避免必须看到父母的所有孩子(可能是很多孩子),而不是一个孩子的所有父母必须是一个孩子.即使DOM很深,它也只会在每个级别查看一个节点而不是RTL匹配中的多个节点.评估CSS选择器LTR或RTL更容易/更快？

例如:

div > p.some_class {
  /* Some declarations */
}

这个>符号究竟意味着什么？

用逗号分隔的CSS选择器部分的正确术语是什么？

    body.foo .login , body.bar .login { ... }
/*                  |
           Part 1   |  Part 2         */

在这些部分,什么是部分术语通过组合子分隔(空格,+,>,等)？

    body.foo .login , ... { ... }
/*          |
   Part 1   |   Part 2    */

我有一些元素DIV,根据屏幕的大小重新排序.我想根据它们的弹性盒顺序不同地设置每个元素的样式.因为媒体查询在框架内部,所以我宁愿不编写自己的媒体查询来执行此操作,因为如果框架更改了媒体查询的断点,我不想记得更改我的媒体查询.我尝试使用+兄弟选择器,但显然这仅适用于原始标记中元素的顺序,而不适用于弹性框渲染顺序.有没有办法根据渲染DOM中出现的顺序为元素设置样式？

CSS 似乎是右关联的，与编程语言不同，你不能用括号影响它。

我有这样的一般结构：

<div>
   <div class='pizza'></div>
</div>
<p>Select me!  Select me!</p>

<div>
   <div class="pizza">
      <p>Do NOT select me!</p>
   </div>
</div>

我无法找出包含 a 的<p>兄弟姐妹之后的a 选择器。<div><div class="pizza">

我尝试了这个，但是 CSS 从右到左的关联性并没有产生我想要的结果：

div > div.pizza + p

我知道这是不对的。

有人可以指点一下吗？

以下两种选择节点的方法不应该产生相同的结果吗？

let tmp = fruits.querySelector("ul:first-of-type li:first-of-type");
tmp = tmp.querySelector("span")    

对比

let tmp = fruits.querySelector("ul:first-of-type li:first-of-type span");

（在此处查看实际操作）

我已经在 Firefox 和 chrome 中对此进行了测试。两种情况下的结果不同。任何人都可以请解释为什么？

堆栈片段中的示例：

let tmp = fruits.querySelector("ul:first-of-type li:first-of-type");
tmp = tmp.querySelector("span")    

let tmp = fruits.querySelector("ul:first-of-type li:first-of-type span");

如果要为一组后代分配相同的样式,为什么没有一种简单的方法来使用CSS？

假设您有一个HTML表,如下所示:

<table id='myTable'>
  <tr>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  .
  .
  .
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

为什么必须使用以下选择器设置所有列标题和单元格的样式？

#myTable th, #myTable td {}

为什么没有类似下面的语法？

#myTable (th,td) {}

例如，div > p可用于选择<p>元素的直接子元素的所有元素<div>。div > p > span用于选择<span>具有<p>父级和<div>祖父级的元素是否有效？

CSS 选择器中的其他运算符呢？使用'+' indiv + p + span或',' in是否有效div, p, span？

如何组合不同的选择器？喜欢div + p > span？

我能找到的最新信息是W3C选择器4级编辑器的草稿,但据我所知,它不再提及父选择器了.

我知道谷歌有一项关于此的调查,但现在已经结束了.

父选择器发生了什么？它会被引入,还是被删除了？

代码说明胜于文字

<div class="parent">
  <span class="child"></span>
</div>
<div class="outside"></div>

我想做的事

.child:hover ? .outside { }

?我要寻找的选择器在哪里