我如何使用 css 选择器只为两个 div 之间同类的第一个 div 提供样式？

Question

我想在下面的代码中使用 class 块为第一个 div 设置边框：

<div class="col-md-4 news">
            <h3>News Feed</h3>
            <div class="block">
              <p class="date"><span>15</span>march</p>
              <p><a href="#">serving people from 23 branches all over the nepal</a></p>
              <div class="clearfix"></div>
            </div>
            <div class="block">
              <p class="date"><span>17</span>march</p>
              <p><a href="#">serving people from 23 branches all over the nepal</a></p>
              <div class="clearfix"></div>
            </div>
          </div>

Answer 1

使用first-of-type 选择器。来源 here

.block:first-of-type {
    border:2px solid red;
}

JSFiddle

Answer 2

使用以下代码：

.news > div:first-child

Answer 3

我会建议

.block:first-of-type {
 border: yourborder;
}

Answer 4

尝试：

.col-md-4.news h3 + .block{ border:solid 1px #000; }

Answer 5

  .col-md-4 .block:first-of-type{
      border:1px solid RED;
   }

Answer 6

您可以为此使用 first-of-type 伪选择器：

.news .block:first-of-type {border:1px solid #000;}

Fiddle Here

Answer 7

这会起作用

.block:first-of-type {
    border:solid 1px #ccc;    
}

我如何使用 css 选择器只为两个 div 之间同类的第一个 div 提供样式？

how can i use css selector to give style only to a first div between two divs of the same kind?

html

css

selector