gpt4 book ai didi

css - 相邻的兄弟选择器和 :before pseudo element in Chrome 10

转载 作者:太空宇宙 更新时间:2023-11-03 19:17:49 27 4
gpt4 key购买 nike

这很奇怪。 <OL>http://www.madebypaz.com/profile使用 :before图表注释的伪元素(ABC 和图像)。我像这样使用相邻的兄弟选择器:

#profiletext ol li:before {
content: 'A';
}

#profiletext ol li+li:before {
content: 'B';
}

#profiletext ol li+li+li:before {
content: 'C';
}

#profiletext ol li+li+li+li:before {
content: '';
}

#profiletext ol li+li+li+li {
background: url('/wp-content/themes/paz2010/images/sweet-spot.png') no-repeat;
margin-left: 0;
padding-left: 38px;
}

#profiletext ol li {
height: 30px;
margin-left: 10px;
}

这可能不是最优雅的解决方案,但它在包括 Chrome 在内的所有浏览器中都能完美运行,直到有人向我指出它在 Chrome 10 中出现问题。在 Chrome 10 中,当您将鼠标悬停在上面时,它会显示 AAA 并更改为正确的字符.这很好奇,因为甚至没有定义 :hover 样式!

这是一个屏幕录像:http://cl.ly/0E170v1Z0O2E0f3F0j0d

为什么会发生这种情况,我该如何解决?有没有更好的方法来达到相同的结果?

非常感谢任何指点!

最佳答案

这在 Chrome 16 上按预期工作 - 需要一个简单的更新。

关于css - 相邻的兄弟选择器和 :before pseudo element in Chrome 10,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5666961/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com