专栏首页白胡杨同学CSS组合选择符

CSS组合选择符

什么是组合选择符?

组合选择符说明了两个选择器直接的关系。

CSS组合选择符有几种,都是什么?

在 CSS3 中包含了四种组合方式: 后代选择器(以空格分隔) 子元素选择器(以大于号分隔) 相邻兄弟选择器(以加号分隔) 普通兄弟选择器(以波浪号分隔)

后代选择器

后代选择器用于选取某元素的后代元素。

div p
{
  background-color:yellow;
}
子元素选择器

与后代选择器相比,子元素选择器(Child selectors)只能选择作为某元素子元素的元素。

div>p
{
  background-color:yellow;
}
相邻兄弟选择器

相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素,且二者有相同父元素。

div+p
{
  background-color:yellow;
}
后续兄弟选择器

后续兄弟选择器选取所有指定元素之后的相邻兄弟元素。

div~p
{
  background-color:yellow;
}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • CSS选择器的分类

    白胡杨同学
  • CSS大部分属性汇总

    白胡杨同学
  • 句子成分(枝干)

    白胡杨同学
  • 企业面试题:css选择器有哪些,选择器的权重的优先级

    舒克
  • 爬取数据不是非要Python

    最近有朋友问是否可以不用Python编程就能爬取数据并分析,想起来正好之前写了一篇文章,关于Web Scraper的使用,由于之前忘记标记原创,今天就再发一次。...

    用户1564362
  • 常见选择器

    Id选择器(同一页面不能重名)# 类选择器 . 标签选择器 p 包含选择器 .box p 群组选择器 , 通配符 *

    河湾欢儿
  • CSS复合选择器

    CSS选择器分为 基础选择器 和 复合选择器 ,但是基础选择器不能满足我们实际开发中,快速高效的选择标签。

    乐心湖
  • 从零开始学 Web 之 CSS(一)选择器

    CSS 全称为 Cascading Style Sheets,中文翻译为“层叠样式表”,简称 CSS 样式表,所以称之为层叠样式表(Cascading Styl...

    Daotin
  • css选择器

                选择器{... !important} 则该选择器的优先级最高

    十月梦想
  • 【融职培训】Web前端学习 第2章 网页重构5 css选择器进阶

    上一节我们已经掌握了常用css选择器和css的一些常用属性,本节我们进一步扩展css选择器的内容包括内容如下:

    学习猿地

扫码关注云+社区

领取腾讯云代金券