接下来对CSS其他属性进行解释。
-
字体
font-family
:设置文字的字体,属性值为字体名。使用font-family
指定的字体,需要求这些字体在当前系统上已经安装了,如果你指定的字体在当前系统上未安装,则不能正确显示。font-size
:设置当前文本内容字体的大小,属性值可以是:xx-small(最小字体),x-small(较小字体),small(小字体),medium(正常大小的字体,是默认值),large(大字体),x-large(较大字体),xx-large(最大字体),larger(相对于父元素中的字体进行相对增大),smaller(相对于父元素中的字体进行相对减少),具体值/百分比值(直接设置字体大小)。font-weight
:设置当前文本内容字体的粗细,属性值分为两种:- 数字:100、200、300....
- 单词:lighter(更细)、normal(正常)、bold(加粗)、bolder(更粗)。
font-style
:设置文字风格,属性值有normal(正常)、italic(斜体)、oblique(倾斜)。text-decoration
:设置文本装饰,常用属性值有4种:underline
(下划线),none
(无修饰),overline(
上划线),line-through
(删除线)。color
:控制文字颜色。font-variant
:设置文字的大写字母的格式。属性值可以是normal(正常的字体)、small-caps(小型的大写字母)。text-shadow
:设置文字是否有阴影效果,属性值为具体像素值,顺序同边框粗细。text-transform
:设置文字的大小写。
-
文本
text-indent
:指定文本第一行的缩进,属性值为具体像素值。letter-spacing
:指定文本中字符之间的间距,属性值为具体像素值。word-spacing
:指定文本中单词之间的间距,属性值为具体像素值。white-space
:指定元素内部空白的处理方式,属性值为具体像素值,或是normal(默认属性值,浏览器忽略文本中的空白)、pre(浏览器保留文本中的所有空白),nowrap(文本不会换行),pre-wrap(保留空白符序列),pre-line(合并空白符序列),inherit(指定从父元素继承white-space属性的值)。text-align
:设置文本的水平对齐方式,属性值可以是left(左对齐)、 right(右对齐)、center(居中对齐)和justify(两端对齐)。line-height
:设置文本行高操作,属性值为具体像素值。vertical-align
:设置目标元素里内容的垂直对齐方式,属性值有top(顶端对齐),bottom(底对齐)等。word-break
:设置目标元素中文本内容的换行方式,属性值有normal(按浏览器默认规则进行换行),keep-all(只能在半角空格或连字符处换行),break-all(设置允许在单词中间换行)。word-wrap
:设置目标元素中文本内容的换行方式,属性值有normal(按浏览器的默认规则进行换行),break-word(设置允许在单词中间换行)。
-
表格
border-collapse
:控制两个单元格的边框是合并在一起,属性值可以是seperate(边框分开,使得单元格的分隔线为双线),collapse(边框合并,使得单元格的分隔线为单线)。border-spacing:
设置两个单元格边框之间的间距。- table-layout:设置表格宽度布局的方法。属性值有auto(默认值,平时常见的表格布局方式),fixed(指定使用固定布局方式)。
-
鼠标
cursor
:设置鼠标样式,属性值有:- all-scrolling:十字箭头光标。
- col-resize:水平拖动线光标。
- crosshair:十字线光标。
- move:移动十字箭头光标。
- help:带问号的箭头光标。
- no-drop:禁止光标。
- not-allowed:禁止光标。
- pointer:手形光标。
-
布局
display
:规定是否/如何显示元素,属性值为none(不显示),block(块元素),inline(内联元素),flex(弹性盒子)。justify-content
:设置主轴上的子元素排列方式,属性值有flex-start(项目位于容器的开头)
,flex-end(项目位于容器的结尾
)
,center(项目位于容器中央)
,space-between(项目在行与行之间留有间隔)
,space-around(项目在行之前、行之间和行之后留有空间)
。