CSS IE8 的第一个孩子和最后一个孩子
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8840802/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
first-child and last-child with IE8
提问by Bronzato
I have some css for adjusting things in my table.
我有一些 css 用于调整表格中的内容。
Here it is:
这里是：
.editor td:first-child
{
width: 150px;
}
.editor td:last-child input,
.editor td:last-child textarea
{
width: 500px;
padding: 3px 5px 5px 5px;
border: 1px solid #CCC;
}
It works with Firefox, Safari and Chrome but not (at this time) with IE8.
它适用于 Firefox、Safari 和 Chrome，但（目前）不适用于 IE8。
I know the problem comes from the first-child and last-child but I'm not an expert.
我知道问题来自第一个孩子和最后一个孩子，但我不是专家。
Any idea how I can fixt it?
知道如何解决它吗？
PS: I added <!doctype html>on top of my html document but nothing changed.
PS：我添加<!doctype html>在我的 html 文档之上，但没有任何改变。
回答by BoltClock
If your table is only 2 columns across, you can easily reach the second tdwith the adjacent sibling selector, which IE8 does support along with :first-child:
如果您的表格只有 2 列，您可以td使用相邻的兄弟选择器轻松到达第二个，IE8 确实支持:first-child：
.editor td:first-child
{
width: 150px;
}
.editor td:first-child + td input,
.editor td:first-child + td textarea
{
width: 500px;
padding: 3px 5px 5px 5px;
border: 1px solid #CCC;
}
Otherwise, you'll have to use a JS selector library like jQuery, or manually add a class to the last td, as suggested by James Allardice.
否则，你将不得不使用一个JS选择库如jQuery，或手动添加一个类的最后td，由詹姆斯·阿勒代斯的建议。
回答by James Allardice
Since :last-childis a CSS3 pseudo-class, it is not supported in IE8. I believe :first-childis supported, as it's defined in the CSS2.1 specification.
由于:last-child是 CSS3 伪类，因此在 IE8 中不支持。我相信:first-child支持，因为它在 CSS2.1 规范中定义。
One possible solution is to simply give the last child a class name and style that class.
一种可能的解决方案是简单地给最后一个孩子一个类名和该类的样式。
Another would be to use JavaScript. jQuery makes this particularly easy as it provides a :last-childpseudo-class which should work in IE8. Unfortunately, that could result in a flash of unstyled content while the DOM loads.
另一种方法是使用 JavaScript。jQuery 使这变得特别容易，因为它提供了一个:last-child应该在 IE8 中工作的伪类。不幸的是，这可能会导致在 DOM 加载时出现无样式的内容。
回答by blues_driven
If you want to carry on using CSS3 selectors but need to support older browsers I would suggest using a polyfill such as Selectivizr.js
如果您想继续使用 CSS3 选择器但需要支持旧浏览器，我建议您使用诸如Selectivizr.js 之类的 polyfill
