CSS字体和文本样式

CSS字体和文本样式

1. 字体样式

• 字体大小: font-size

  数字+px

• 字体粗细: font-weight

  正常: normal或400; 加粗: bold或700

• 字体样式: font-style

  正常: normal; 倾斜italic

• 字体类型: font-family

• 字体类型: font属性连写

2. 文本样式

• text-indent文本缩进

  取值:

  数字+px

  数字+em(推荐: 1em=当前标签的font-size的大小)

• text-align文本水平对齐方式

  取值:

属性值	效果
left	左对齐
center	居中对齐
right	右对齐

(如果需要让文本水平居中, text-align属性给文本所在标签(文本的父元素)设置

• text-decoration文本修饰

  取值:

属性值	效果
underline	下划线(常用)
line-through	删除线(不常用)
overline	上划线(几乎不用)
none	无装饰线 (常用)

注意: 开发中会使用text-decoration: none; 清除a标签默认的下划线

• line-height行高

  作用: 控制一行的上下行间距

  取值: 数字+px

  倍数 (当前标签font-size的倍数)

  应用：

  ​ 让单行文本垂直居中可以设置 line-height : 文字父元素高度

  ​ 网页精准布局时，会设置 line-height : 1 可以取消上下间距
  行高与font连写的注意点：
  ​ 如果同时设置了行高和font连写，注意覆盖问题
  ​ font : style weight size/line-height family ;