Question

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

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

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>

相同元素的不同风格

1 个答案: