有没有伪类不起作用的场景?

时间:2011-11-08 05:43:46

标签: css css-selectors pseudo-class image-replacement

这听起来像一个抽象的问题,但我正在尝试对我正在进行的这个项目进行故障排除,而我却不知所措。

我不得不接管一个项目,因为第一个开发人员被解雇了,所以我犯了新的错误,从第1天起就没有重新启动它。我已经修复了数百个错误并且几乎重做了所有内容。一切都来自非语义代码,内嵌布局元素,不必要的切片文本图像,并且必须将所有内容从CSS2转换为CSS3。

我说这一切都是因为这里有太多的代码要包括在内,我希望也许我描述我的情况会挖掘别人的不良经验来建议我。

问题:我有一个页面没有任何效果。我从外部样式表中删除了相应的CSS,并在内部样式表中重写了它。我遇到的两个最大问题是伪元素和伪类无法正常工作。我挣扎了一段时间试图弄清楚它是否是我正在使用的东西,但后来我尝试了不同的伪类,如p:first-child {color:red}而没有。

我在页面上也有图像替换问题。我通常的文本缩进不起作用,文本只停留在页面上。

我不确定其他哪些信息是否相关,所以如果您需要查看任何内容或提出任何问题,请随时提出。我提前感谢你拯救了一个像我这样的女人拔出她的头发:)

修改

以下是页面代码的链接:http://jsfiddle.net/syren/Zsj2T/网站上的其他内容都有效,所以我必须假设它与页面上的代码有关。

2 个答案:

答案 0 :(得分:1)

我发现你正在使用#history p:first-child

您可能希望此选择器选择<p>的第一个#history元素,但这是错误的。 :first-child选择器仅选择第一个孩子的元素。

要选择第一个<p>元素,您必须使用#history p:first-of-type

您的代码结构,在树视图中:

div#history    
    h2        :first-child 
    a.share   :nth-child(2)
    p         :nth-child(3)  p:first-of-type

小提琴:http://jsfiddle.net/Zsj2T/1/
PS。快速参考MDN: Pseudo-classes

答案 1 :(得分:-1)

阅读此article 检查每个伪元素与浏览器的兼容性。

提示:不要使用颜色名称(RED),而是使用颜色十六进制值(#F00),因为颜色名称已根据w3c