4.1 字体属性
字体属性是用来设定“文字字形”的外观表现,主要包括:
颜色, 字体名称, 大小, 是否斜体(字体样式), 是否粗体。
color, font-family, font-size, font-style font-weight
常用字体属性如下所示:
属性名称 | 含义与说明 | 举例 | 其他 |
---|---|---|---|
color | 文字的颜色,又称为“前景色” | color: red; color:#ff0000; color:rgb(255, 50, 100) color:rgba(250,0,0,0.7) | 颜色值可以有多种写法 |
font-family | 文字的字体,比如宋体,黑体,微软雅黑,隶书。 | font-family: 宋体; font-family: 微软雅黑,宋体; font-family: “Times New Roman”; | 可以设定多个值,浏览器优先使用前面的,没有再依次找后面的,或使用内部字体。 |
font-size | 文字的大小 | font-size: 14px; | px是长度单位,表示“像素” |
font-style | 文字的样式(决定字体是正体还是斜体) | font-style: itatic; font-style: normal;(默认值) | normal(正常字体,默认值);itatic(斜体) |
font-weight | 文字的粗细度 | font-weight: bold; font-weight:bolder; | 有4个值可用: normal, bold, bolder, lighter |
font | 上述所有文字属性的综合属性。 | font:red 宋体 14px italic bold; | 属性值依次写出,空格隔开,不分顺序 |
4.2 文本属性
文本属性通常指的是作为文字内容的整体性特性(而不是具体文字的表现特性)。
常用属性有:
属性名称 | 含义 | 举例 | 其他说明 |
---|---|---|---|
text-align | 一段文字的对齐方式 | text-align: center; | 可用值:left, center, right |
text-decoration | 一段文字的”修饰线” | text-decoration:underline | 可用值:underline(下划线),overline(上划线),line-through(中划线) |
text-indent | 设置一段文本的“首行缩进”的宽度(距离) | text-indent: 24px; | px是长度单位,表示“像素” |
line-height | 设定文字的“行高” | line-height: 30px; line-height: 2em; | em是长度单位,表示“字高” |
letter-spacing | 设定文字的“字符间距” | letter-spacing: 3px; | 注意:中文的每个字都算一个字符 |
word-spacing | 设定文字的“单词间距” | word-spacing: 15px; | 注意:单词通常是以“空格”隔开的。因此,连续的中文即使很长也只能算一个单词。 |