css中“~”

element1~element2 选择器匹配出现在element1后面的element2。
element1和element2这两种元素必须具有相同的父元素，但element2不必紧跟在element1的后面。

如：

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8">
</head>
<style>p~ul { background: #00ccff; }
</style>
<body>
<p>测试~</p>
<ul><li>a</li><li>b</li></ul>
<ul><li>1</li><li>2</li></ul>
</body>
</html>

结果：

element,element
div,p
选择所有<div>元素和<p>元素

element element
div p
选择<div>元素内的所有<p>元素

element>element
div>p
选择所有父级是 <div> 元素的 <p> 元素，（只选择第一代）

element+element
div+p
选择所有紧接着<div>元素之后的<p>元素

css中“>”

css3特有的选择器，A>B 表示选择A元素的所有子B元素。与A B的区别在于，A B选择所有后代元素，而A>B只选择一代。

.a，.b｛逗号指相同的css样式｝

.a .b｛空格指所有后代元素｝

.a>.b｛大于号指子代元素｝

转载于:https://www.cnblogs.com/grasp/p/10997074.html

css中.，,，“~”和“”符号的意义相关推荐

css中大于符号是什么意思
css中大于符号是css3特有的子元素选择器,子元素选择器只能选择作为某元素子元素的元素,其语法如"h1 > strong {color:red;}". 推荐:<css ...
python各种常用符号的意思_写一篇专门介绍python中各种符号的意义及用法
挖槽,小米今天上市就破发了,好多认购的小伙伴有点慌了,其实对于小帅b来说这很正常,没必要慌,保持持有就好了,相信小米会越来越牛逼的.小米和可能会成为互联网新一代的霸主主一,到时候可能就不是BAT了,而 ...
c语言中各个符号的意义及作用是什么,C语言特殊符号意义
初学者可以来学学,包教包会 C语言中像%D &%f符号的作用说一下最佳答案 C语言中的符号运算符的种类C语言的运算符可分为以下几类: 1.算术运算符用于各类数值运算.包括加(+).减(- ...
css里的符号含义【串联选择器】和【后代选择器】
先介绍一下串联选择器和后代选择器的概念. 串联选择器作用在同一个标签上. <div class="a" id ="qq"><span> ...
CSS中加号、星号及其他符号的作用
转自:http://blog.sina.com.cn/s/blog_6790717801011dx8.html 首先,什么是CSS hack? 针对不同的浏览器写不同的CSS code的过程,就叫CS ...
初等矩阵及初等变换中的符号意义
初等矩阵及初等变换中的符号意义
html中号选择器,CSS兄弟选择器符号‘+’号与‘~’号的区别
今天有人问我,在CSS的兄弟选择器中'+'号和'~'号码的区别是什么,而我自己对这个问题也不是很清除,当然,如果想弄清楚一个问题,用实践的方式比较好,今天就通过举几个例子来说明一个,CSS选择器中的加 ...
html中三角向下符号,使用css实现三角符号效果
关于使用css制作三角符号,网上有很多的例子了,在这里只是为了详细的向各位解释一下三角符号的原理下图,是一个长宽为100px,边框宽度为100px的一个元素,由此可见,在css中上下左右的边框相交处 ...
c语言中特殊符号意义,C语言特殊符号意义Word版
<C语言特殊符号意义Word版>由会员分享,可在线阅读,更多相关<C语言特殊符号意义Word版(18页珍藏版)>请在人人文库网上搜索. 1.传播优秀Word版文档 ,希望对您有 ...

css中.，,，“~”和“”符号的意义