一,文本
1,文本颜色
color设置文本颜色
2,文本对齐
text-align设置文本的水平对齐方式
text-align: justify 行对齐 场景(新闻)
3,垂直对齐
vertical-align:top 上
vertical-align:middle 中
vertical-align:bottom 下
4,文本装饰
text-decoration 设置或删除文本装饰
text-decoration :none 删除下划线
text-decoration :overline 上划线
text-decoration :line-through 删除线
text-decoration :underline 下划线
5,文本缩进
text-indent 设置文本第一行的缩进
6,字符间距
letter-spacing 用于指定文本中字符之间的间距
7,文本阴影
text-shadow 为文本添加阴影
text-shadow: 水平阴影 垂直阴影 模糊度 颜色
8,文本溢出
overflow:hidden(隐藏)
visible:默认值,内容不会被修剪。
hidden:内容会被修剪,超出的文本会隐藏;
scroll:内容会被修剪,浏览器会显示滚动条。;
auto:如果内容被修剪,则浏览器会显示滚动条,以便查看其它的内容;(超出会显示,不超出不显示,只显示y方向的)
inherit:规定应该从父元素继承overflow属性值。
white-space:nowwrap 强制一行
text-overflow:ellipsis 超出显示省略号
二,字体
1,字体
font-family 规定文本的字体
2,字体样式
font-style 用于斜体文本
font-style: normal 文本正常显示
font-style: italic 文本以斜体显示
3,字体粗细
指定字体的粗细
font-weight:normal 正常
font-weight:bold 加粗
4,字体大小
1,font-size 设置文本的大小
绝对尺寸:
将文本设置为指定大小
不允许用户在所有浏览器设置中更改文本大小(可访问性不佳)
当输出的物理尺寸已知时,绝对尺寸很有用
相对尺寸:
设置相对于周围元素的大小
允许用户在浏览器中更改文本大小
以em设置字体大小
为了允许用户调整文本大小,因此,默认大小 1em 为 16px。
响应式字体大小
文本大小将遵循浏览器窗口的大小。当调整浏览器窗口的大小时,字体大小将会缩放。 1vw=1%
三,图像
1,背景图像
background-image :url( ) 用作设置背景图片
默认情况下,图像会重复,以覆盖整个元素。
2,背景重复
background-repeat:no-repeat 背景不允许重复
background-repeat:repeat-x 背景水平重复
background-repeat:repeat-y 背景垂直重复
3,背景位置
指定背景图的位置
background-position :x(水平方向) y(垂直方向)
4,简写背景属性
可以在一个属性中指定所有背景属性。
background: 背景颜色 url引入的背景 no-repeat right top