同一元素的样式不同

Question

我有一个由应用程序使用模板生成的网站。 我的问题是我试图在某些图像上使用某些过渡效果。

图像和过渡的代码在<ul> & <li>元素中设置，但会弄乱模板<ul> & <li>样式。 有没有办法让我设置一些仍以<ul> <li>元素为目标的css，但要选择我要在图像代码上设置的css。

Answer 1

您可以通过:nth-of-type()选择li并给出您的特殊样式

 li:nth-of-type(1) { background: red; } li:nth-of-type(2) { background: green; } li:nth-of-type(3) { background: blue; } li:nth-of-type(4) { background: orange; } 

 <ul> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> <li>asd</li> </ul>