css – 第一个孩子没有工作

前端之家收集整理的这篇文章主要介绍了css – 第一个孩子没有工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这个工作我应该疯了吗
.project.work:first-child:before {
  content: 'Projects';
}
.project.research:first-child:before {
  content: 'Research';
}
<div class="project work">
  <p>abcdef</p>
</div>
<div class="project work">
  <p>abcdef</p>
</div>
<div class="project work">
  <p>abcdef</p>
</div>
<div class="project research">
  <p>abcdef</p>
</div>

项目:一胎工程罚款,研究:第一胎不粘.有任何想法吗?

Demo它不起作用,但最好的方法是什么?

解决方法

:第一个孩子只选择其父母的第一个孩子.没有其他的.

如我在网站上的其他几个答案(1 2 3 4)中提到的,没有:第一类伪类.如果您希望将样式应用于div类别的每个类的第一个,则解决方案是将样式应用于该类的所有子项,以及一般的兄弟选择器来撤销后续兄弟姐妹的样式.

你的CSS会像这样:

.project.work:before {
    content: 'Work';
}

.project.research:before {
    content: 'Research';
}

.project.work ~ .project.work:before,.project.research ~ .project.research:before {
    content: none;
}

猜你在找的CSS相关文章