css总结-css优先级-css继承

css 块级元素和行内元素有哪些，css 属性继承会继承哪些

1、css优先级别 

　　

!important > 行内样式 > ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性。

id选择器（#id）; 0 1 0 0
类选择器（.class); 0 0 1 0
标签选择器（div）; 0 0 0 1
通配符（*）；
属性选择器（a[rel = 'xyz'];
伪类选择器（a:hover,li:nth-child); 0 0 1 0
相邻选择器（h1+p）；根据基础选择器权重叠加
子选择器（ul>li）；根据基础选择器权重叠加
后代选择器（li a）；根据基础选择器权重叠加
优先级就近原则，同权重样式定义最近者为准,载入样式以最后载入的定位为准；优先级：!important >行内样式（1 0 0 0）> id > class > tag > *(通配符)

 

css3 优先级排序
!important(权重最大)1000>内嵌样式（style=""）>内部样式>外联样式>@import url("url");

　　

css3属性和优先级别

*通用选择器，ID选择器 ，.类选择器class，标签选择器，标签组合选择器，伪类选择器：，+相邻元素选择器，>子元素选择器，~同辈选择器，
x[title]属性选择器[type="button"]，
x[href^="http"]匹配以href值为http打头的地址,
x[href$=".jpg"]匹配所有的图片链接
input[type=checkbox]:checked{};选择checkbox为当前选中的那个标签。

伪类选择器 ------：
p:empty 选择没有子元素的每个 <p> 元素（包括文本节点）。
:first-child 第一个
:last-child 最后一个
:nth-child(11) 1--11个
x:first/x:after 在x选择器之前或者之后插入内容

伪元素选择器
::before ,::after 通过 css 模拟出来html标签的效果

　　

css3的新特性

1，@font-face加载字体样式，
2，文字渲染，text-decoration,text-fill-color:文字内部填充颜色，text-stroke-color:文字边框填充颜色，text-stroke-width:文字边界宽度。
3,css3的多列布局 Column-count：表示布局几列。Column-rule：表示列与列之间的间隔条的样式 Column-gap：表示列于列之间的间隔
4，边框圆角的布局。border-radius:50px;
5,css3的渐变效果， （gradient）
6,css3的阴影效果图 （shadow反射和reflect反射效果）
7，css3的多背景图片
8，css3的动画效果 animation

　　

　　

2、常用的css不可继承属性

display：规定元素应该生成的框的类型

text-decoration：规定添加到文本的装饰

text-shadow：文本阴影效果

white-space：空白符的处理

盒子模型的属性：width、height、margin 、border、padding

背景属性：background

定位属性：float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index

　　

 

3、css可继承属性

font：组合字体

font-family：规定元素的字体系列

font-weight：设置字体的粗细

font-size：设置字体的尺寸

font-style：定义字体的风格

text-indent：文本缩进

text-align：文本水平对齐

line-height：行高

color：文本颜色

visibility：元素可见性

光标属性：cursor

　　

4、所有元素可以继承的属性

1、元素可见性：visibility

2、光标属性：cursor

5、内联元素可以继承的属性

1、字体系列属性

2、除text-indent、text-align之外的文本系列属性

3、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。

6、块级元素可以继承的属性

text-indent、text-align

inherit（继承）值

每一个属性可以指定值为“inherit”，即：对于给定的元素，该属性和它父元素相对属性的计算值取一样的值。继承值通常只用作后备值，它可以通过显式地指定“inherit”而得到加强，例如：

p { font-size: inherit; }

7、其他

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

表格元素可继承：border-collapse。