相关疑难解决方法(0)

我正在寻找更多关于邮件列表讨论等的链接,而不是猜测.

任何人都可以帮我找出CSS Selectors Level 3规范中引用的错误处理规则背后的基本原理.

用户代理必须遵守处理解析错误的规则:

• 包含未声明的命名空间前缀的简单选择器无效
• 包含无效简单选择器,无效组合符或无效标记的选择器无效.
• 包含无效选择器的一组选择器无效.

重用规范选择器必须定义如何处理解析错误.(在CSS的情况下,删除使用选择器的整个规则.)

我有以下规则:

#menu li.last, #menu li:last-child {
  ...
}

为了弥补IE8缺乏最后一个孩子的支持,我使用了一个类和一个JavaScript垫片.但是,这不起作用,因为IE8符合错误处理的CSS规范,并丢弃整个规则,因为它无法识别一个选择器.这可以通过将两个选择器分成单独的规则来解决.

为什么这是可取的？为什么规范没有建议简单地丢弃无法识别的选择器,而是保留规则的其余部分？

我想知道其基本原理,因为目前的规则似乎是违反直觉的.

我只是尝试编写以下规则来为支持它的浏览器设置输入占位符的样式:

#main input::-webkit-input-placeholder,
#main input:-moz-placeholder
{
    color: #888;
    font-style: italic;
}

问题是该规则未得到应用.但是,如果我这样打破它,它可以正常工作:

#main input::-webkit-input-placeholder
{
    color: #888;
    font-style: italic;
}
#main input:-moz-placeholder
{
    color: #888;
    font-style: italic;
}

为什么我不能对特定于浏览器的选择器进行分组,还是有其他方法可以做到这一点？对同一元素重复两次相同的属性是不对的.

更新:

刚刚发现这个资源说明它无法完成,但到目前为止还没有关于原因的信息.看起来奇怪的是,浏览器必须放弃整个规则,因为它无法识别其中一个选择器.

问题

使用下面只是简单的不正常工作-webkit-和-moz-浏览器:

#exampleElement {
    background-color: red; /* For example */
}

#exampleElement ::selection {
    color: black;
    background-color: white;
}

结果:WebKit和Blink驱动的浏览器

在浏览器,Opera和Safari,::selection的background-color呈现,如果它是50%的α,但字体颜色是正确的.

Chrome 29.0.1547.62:

Opera 15.0.1147.130:

Safari 5.34.57.2:

结果:支持Gecko的浏览器

在Firefox中,将::selection忽略整个规则.::selection的background-color恰好是白因#exampleElement的黑暗background-color(感谢@BoltClock用于注意到,)

Firefox 22.0:

结果:Trident驱动的浏览器

在Internet Explorer中,(你会相信)一切都完美呈现.

Internet Explorer 10.0.9200.16660:

这仅仅是这些渲染引擎/浏览器的漏洞还是有-webkit-和-moz-我是不知道的替代品？

我在jsFiddle上保存了一个这样的例子,供大家看看:http://jsfiddle.net/BWGJ2/

如果要为一组后代分配相同的样式,为什么没有一种简单的方法来使用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) {}