CSS选择器

选择符类型	例子	例子描述
通用选择器	*
类别选择器(.class)	.intro	选择class='intro'的所有元素
ID选择器(#id)	#first	选择id='first'的所有元素
标签选择器(element)	div	选择所有<div>标签
后代选择器(element element)	div p	选择<div>元素内部的所有<p>元素
子选择器(element>element)	div>p	选择父元素为<div>的所有<p>元素
群组选择器(element,element)	div,p	选择所有<div>和<p>元素
相邻同胞选择器(element+element)	div+p	选择紧接在<div>之后的所有<p>元素
伪类选择器(:link :visited :active :hover :focus :first-child)	a:link a:visited a:active a:hover input:focus p:first-child	（选择所有未被访问的或所有已被访问的或活动的链接）（选择鼠标指针位于其上链接）（选择获得的焦点的input 元素）
伪元素选择器(:first-letter :first-line :before :after :lang(language))	p:first-letter p:first-line p:before p:after p:lang(it)	选择每个元素的首字母；选择每个元素的首行；在每个 元素的内容之前插入内容；在每个元素的内容之后插入内容；选择带有以 'it'开头的 lang 属性值的每个元素
属性选择器([attribute] [attribute=value] [attribute~=value] [attribute|=value] )	[target=_blank] [attribute~=value]	选择包含一个以空格分隔的词为value的所有元素；[attribute|=value]选择属性的值等于value，或值以 value- 开头的所有元素

css3新增

• 层次选择器
• 伪类选择器

CSS哪些属性可以继承

css继承特性主要是指文本方面的继承，盒模型相关的属性基本没有继承特性。

不可继承的： display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、top、bottom、left、right、z-index、float、clear、 table-layout、vertical-align。

所有元素可继承的： visibility和cursor

终极块级元素可继承的： text-indent和text-align

内联元素可继承的： letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction

列表元素可继承的： list-style、list-style-type、list-style-position、list-style-image

important

使用 !important 可以改变优先级别为最高，其次是style对象，然后是id > class >tag ，另外在同级样式按照申明的顺序后出现的样式具有高优先级。

深度选择器 >>>

使用 >>> 操作符可以使 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件

<style scoped>
 #app >>> a { color: red }
</style>

Sass 之类的预处理器无法正确解析 >>> 。这种情况下你可以使用 /deep/ 或 ::v-deep 操作符取而代之

<style scoped lang="scss">
 #app { 
	 /deep/ a { 
		 color: rgb(196, 50, 140) 
		}
 ::v-deep a {
	 color: rgb(196, 50, 140) 
	 } 
}
</style>