且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

.mui-bar-nav~.mui-content这两个class之间的~什么意思?

更新时间:2022-09-27 13:31:02

匹配 .mui-bar-nav 之后所有的 .mui-content(即同级的其他类或元素)。

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html><html lang="zh-cn"><head>
  <meta charset="UTF-8">
  <title>Document</title>
 
  <style>
    .a ~ .b {      color: red;    }
  </style></head><body>
  <div class="a">a    <div class="b">b1</div>
  </div>
  <div class="b">b2</div>
  <div class="b">b3</div></body></html>

可以看到 b1 是不变色的,b2 和 b3 是会改变颜色的。


更多关于“~”资料:https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_selectors

本文转自  小旭依然  51CTO博客,原文链接:http://blog.51cto.com/xuyran/1784913