使用 CSS 选择兄弟元素
cssweb developmentfront end technology更新于 2024/8/30 0:44:17
如果我们想要匹配紧随第一个选择器之后的元素，我们使用相邻兄弟选择器 (+)。这里，两个选择器都是同一父元素的子元素。
CSS 相邻兄弟选择器的语法如下 −
Selector + Selector{
attribute: /*value*/
}
如果我们想要选择同一父元素的兄弟元素，而不考虑第二个选定元素的位置，我们使用 CSS 通用兄弟选择器。
CSS 通用兄弟选择器的语法如下 −
Selector ~ Selector{
attribute: /*value*/
}
以下示例演示了 CSS 相邻和通用兄弟组合器属性。
示例
Check this
Some text in section
hello
Selected
输出
这将产生以下结果 −
示例
Random text 1
Some text in section
hello
Selected
输出
这将产生以下结果 −
相关文章
使用 CSS3 沿横轴对齐 Flex 项目
如何使用 CSS 将网站水平居中?
如何在网页上使用 Google 字体?
如何使用 CSS 创建响应式博客布局?
如何使用 CSS 创建响应式锯齿形(交替)布局?
如何使用 CSS 创建响应式列卡片?
如何使用 CSS 创建混合列布局网格?
如何使用 CSS 和 JavaScript 创建列表网格视图?
如何使用 CSS 和 JavaScript 创建扩展网格?
如何使用 CSS 创建 4 列布局网格?
有用资源
css 参考教程 - 该教程包含有关 css 的更多信息:https://www.w3schools.cn/css/
打印
下一节:如何使用 CSS 移除无序列表项的缩进? ❯❮ 上一节:使用 CSS ::first-line 创建美观的首行