CSS后代元素选择器用什么符号,使用场景

CSS后代元素选择器用什么隔开

CSS中的后代选择器使用“空格”将父类的选择器与子类的选择器分隔开,后代元素选择器可以使用空格拼接多个选择器,选择器越多,相对来说匹配选择的后代元素更精确一些。语法如下:

选择器1 选择器2 ... 选择器n{属性: 属性值;}

CSS后代元素选择器的使用场景

如果web项目已经部署服务器,然后又想修改HTML文档中的某一个标签的CSS样式,但是该元素又没有设置id或class属性,也不是当前HTML文档中唯一的元素(该元素只有一个),而且又不想在服务器重启应用、重启进程,那该怎么办呢——可以使用CSS的后代元素选择器来实现,之后只要清除一下浏览器的缓存,再刷新一下页面就会发现元素的CSS样式已经改变(纯粹个人经验)。

CSS后代元素选择器实例代码,及在线编辑器

下方实例,匹配选择了class为d1的后代元素p:

<div class="d1">
  <div class="p1">div,设置了class属性</div>
  <p>段落p,未设置了class属性</p>
</div>

<style>
  .d1 p{color:green;font-size:1.2em;}
</style>

免责声明:内容仅供参考。


全栈前端 / CSS教程 :



























Copyright © 2022-2024 笨鸟工具 x1y1z1.com All Rights Reserved.