CSS中有没有一种方法可以访问element.xml中的元素。第一要素，第二要素？

Question

假设我有

  <div class='r1'>

               <div> Apple </div>

               <div> Banana </div>

               <div> Orange </div>

               <div> Tulip </div>

  </div>

我想访问 r1 中的每个元素，但我必须给每个元素一个单独的 id 或类。有什么方法可以让我根据他们的职位数量来访问它。

如

  .r1:first-child{

     color:red;

   }

  .r1:second-child{

     color:blue;

    }

Answer 1

您可以使用:nth-child()选择器。例如：.r1:nth-child(1) {&nbsp; color: red;}.r1:nth-child(2) {&nbsp; color: blue;}您还可以酷公式的东西，如：/* Will make every 5th element red, starting at the second one */.r1:nth-child(5n+1) {&nbsp; color: red;}/* Will make the odd div elements blue */.r1:nth-child(odd) div {&nbsp; color: blue;}

Answer 2

.ri:nth-child(1) {&nbsp; color: red;}.ri:nth-child(2) {&nbsp; color: blue;}