背景
背景颜色
属性:background-color
值:参考颜色的表示方式
背景图片
属性:background-image
值:url();
url里跟的是图片的地址。
背景平铺
属性:background-repeat
值:repeat
(默认)表示平铺这个标签;no-repea
表示不平铺;repeat-x
表示沿x轴平铺;repeat-y
表示沿y轴平铺。
背景定位
属性:background-position
值:left
表示水平方向的左;right
表示水平方向的右;center
表示中间;top
表示垂直方向的上;bottom
表示垂直方向的下。
注意:
- 当方位属性的值只写一个的时候,另外一个值默认居中。
- 如果写2个方位值,顺序没有要求。
如果写的是2个具体值的时候,第一个值代表距离左侧的距离,第二个值代表距离顶部的距离。
固定背景
属性:
background-attachment
值:scroll
表示背景在页面的位置不固定,在页面的位置随内容改变而改变。fixed
表示背景在页面的位置固定,在页面的位置不会随内容改变而改变。相当于在浏览器页面内进行了定位。
附录:背景属性的连写
background:background-color background-image background-repeat background-position background-attachment;
注意:
- background后面只写属性的值;
background-image的url是必写项,顺序无要求。
行高
行高:是基线与基线之间的距离
行高=文字高度+上下边距
注意:一行文字行高和父元素高度一致的时候,垂直居中显示。
行高的计算
单位除了像素以为,行高都是与文字大小乘积。
在继承的时候,不带单位时,行高等于行高乘以子元素文字大小,em和%的行高等于和行高乘以父元素文字大小相乘。行高以像素为单位,就是定义的行高值。
推荐行高使用像素为单位。行高也可以撑开盒子。不设置行高,默认是盒子的高度
行内元素父元素给了行高之后,子盒子不能使用font,要单独设置字体样式,行内元素尽量不适用font。