字体大小

浏览器默认文字大小是16px，单位一定要设置，否则无效
font-size: 16px;

字体粗细

bold    加粗；lighter 变细；纯数字：100-900整百数
font-weight: lighter;

字体样式

italic 倾斜；normal（默认值） 正常
font-style: italic;

字体

font-family: '楷体';
​
如果有多个字体，中间用逗号隔开
​
font-family: '楷体', '黑体';
以第一个字体为准，如果电脑没有这个字体，就显示下一个
（网络开发时，尽量使用系统常见自带的字体，保证不同用户浏览器都能正常显示）

复合写法

语法
font:style weight size famliy
​
例如
font: italic bold 20px '楷体';
（只能省略前两个，省略了相当于设置了默认值）

同时设置单写和连写形式

要把单写的样式写在连写的下面，否则连写样式会覆盖单写样式
如：
font-style: italic;
font: 20px '楷体';
连写样式中虽然没有设置font-style，但不写即为默认值，会覆盖上面的样式

文本缩进

①数字+px
②数字+em
（1em=当前标签的font-size的大小）
text-indent: 32px;
推荐使用：
text-indent: 2em;
（如当前标签的字体大小是16px，那么2em就是2x16=32px）

文本水平居中

如果需要让文本水平居中，text-align给文本所在的标签设置（）文本父元素
left 居左
center 居中
right 居右
text-align：right;

文本修饰

text-decoration：none；
​
underline 下划线（常用）
line-through 删除线（不常用）
overline 上划线（几乎不用）
none 无装饰线（最常用）
none经常用于清除a标签默认的下划线

行高

line-height：20px;
取值：数字+px    倍数（当前标签font-size的倍数）
line-height：2;
让单行文本垂直居中   line-height：文本父元素的高度

 

样式的层叠问题

同一个标签设置了相同的样式，如何渲染？

样式会层叠（覆盖），写在最下面的会生效

css 层叠样式表

层叠就是叠加的的意思，样式可以一层一层的叠加

p {
    color: pink;
    color: red;
}
最终显示是red

 

标签：font,样式,text,字体,楷体,文本
来源： https://www.cnblogs.com/toufuwqm/p/16475655.html