第二常用选择器

王倔强

于 2022-02-09 10:24:30 发布

阅读量204

点赞数

分类专栏：转移2 文章标签： javascript 前端 css3

本文链接：https://blog.csdn.net/qq_43685633/article/details/122819395

版权

转移2 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

本文介绍了CSS中的层级选择器和组合选择器的使用，如`.box1h1,.box1h2`，并展示了如何通过`:hover`伪类为元素添加悬停效果。同时，探讨了伪元素选择器`::before`的应用，用于在`.box2h1`前添加内容。文章通过实例代码解释了这些选择器在网页样式控制中的实际操作。

摘要由CSDN通过智能技术生成

层级+组合选择器

.box1 h1,.box1 h2｛｝

<style>
    .box1 h1,.box1 h2{
      color: aquamarine;
    }
  </style>
</head>
<body>
  <div class="box1">
    <h1>hello world</h1>
    <h2>hello</h2>
  </div>
  <div class="box2">
    <h1>hello world</h1>
  </div>
</body>

在这里插入图片描述

伪类选择器

增加行为

.box1 h2:hover

.box1 h1,.box1 h2:hover{
      color: aquamarine;
    }

在这里插入图片描述

伪元素选择器

增加元素
多用于给多个地方加同样的格式或者其他什么东西

.box2 h1::before{
      content: '增加元素';
    }

在这里插入图片描述

王倔强

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录