CSS ~ and +

以前一直以为css不是怎么厉害，今天忽然发现 . . .

咳。。咳。。

以下是经过测试的哦 ^_^

当然不是那么全面啦，欢迎提意见！

ok，

~ (w3c中国没有找到)

作用：同级别下后面的

比如：

1 <span class="t">上边</span>
2 <div>
3     <span class="t">里面</span>
4 </div>
5 <span class="t">下边1号</span><br />
6 <span class="t">下边2号</span>

现在我们给他加一个样式： div~ .t{color: red;} 

那么谁会有变化呢？ 没错，就是：下边1号和2号变成了红色

+

作用：同级别下紧跟着的(必须紧跟着)

如果我们把样式改为： .t~ .t{color:red;} 

谁变啦？

答案是，木有...因为没有用符合这个规则的元素链

现在，把 html 代码中的 <br/> 去掉

RUN ！

CSS ~ and +,布布扣,bubuko.com