文字居中:
文字水平居中 text-align:center;
文字垂直居中 line-height:height高度;
- 如果行高 等于 height高度 文字会垂直居中
- 如果行高 大于 高度 文字会偏下
- 如果行高 小于 高度 文字会偏上
CSS三大特性
-
层叠性
一般情况下,如果出现样式冲突,则会按照CSS书写的顺序,以最后的样式为准。
-
继承性
所谓继承性是指书写CSS样式表时,子标签会继承父标签的某些样式,如文本颜色和字号。想要设置一个可继承的属性,只需将它应用于父元素即可。
-
优先级
关于CSS权重,我们需要一套计算公式来去计算,这个就是 CSS Specificity,我们称为CSS 特性或称非凡性,它是一个衡量CSS值优先级的一个标准 具体规范入如下:
specificity用一个四位的数 字串(CSS2是三位)来表示,更像四个级别,值从左到右,左面的最大,一级大于一级,数位之间没有进制,级别之间不可超越。
继承或者 * 的贡献值 | 0,0,0,0 |
---|---|
每个元素(标签)贡献值为 | 0,0,0,1 |
每个类class,伪类贡献值为 | 0,0,1,0 |
每个ID贡献值为 | 0,1,0,0 |
每个行内样式贡献值 | 1,0,0,0 |
每个!important贡献值 | ∞ 无穷大 |
权重是可以叠加的
比如的例子:
div ul li ------> 0,0,0,3
.nav ul li ------> 0,0,1,2
a:hover -----—> 0,0,1,1
.nav a ------> 0,0,1,1
#nav p -----> 0,1,0,1
总结优先级:
-
1.使用了 !important声明的规则。
-
2.内嵌在 HTML 元素的 style属性里面的声明。
-
3.使用了 ID 选择器的规则。
-
4.使用了类选择器、属性选择器、伪元素和伪类选择器的规则。
-
5.使用了元素选择器的规则。
-
6.只包含一个通用选择器的规则。
-
7.同一类选择器则遵循就近原则。
-
注意:继承的权重为0
总结:权重是优先级的算法,层叠是优先级的表现