批量处理<div></div>样式

user_tYDk6iCh
  • 49

我想批量处理wrap内的样式,就是每个div中第一个span内的文字为红色,第二个span的元素为白色,请问这个该怎么解决呢?
css和less的相关方法都可以

            <div className="wrap">
                <div>
                    <span>11</span>
                    <span>11</span>
                </div>
                <div>
                    <span>11</span>
                    <span>11</span>
                </div>
                <div>
                    <span>11</span>
                    <span>11</span>
                </div>
                <div>
                    <span>11</span>
                    <span>11</span>
                </div>
                <div>
                    <span>11</span>
                    <span>11</span>
                </div>
            </div>
回复
阅读 290
3 个回答
✓ 已被采纳

less:

.wrap {
  >div span{
    &:nth-of-type(1){
      color: red;
    }
    &:nth-of-type(2){
      color: #fff;
    }
  }
}
.wrap div span:nth-child(1) {
  color: #ff0000;
}
.wrap div span:nth-child(2) {
  color: #ffffff;
}

.wrap span:nth-child(1){ 样式 }
.wrap span:nth-child(2){ 样式 }

你知道吗?

宣传栏