行高与文字处理

• line-height
  文字占有的实际高度
  • 字体框
    一个字可以看成一个小框，font-size实际上设置的字体框的高度
    行高会在字体框的上下平均分布
  • 设置行高的方式：
    • 像素
    • 数值
      以字体大小的倍数设置行高
      默认的行高为1.33

  line-height: 100px;
  line-height: 2;
  

• font-weight 字重
  设置字体的加粗效果
  属性值：bold(加粗)、normal(正常)
• font-style 字体风格
  属性值：italic(斜体)、normal(正常)
• 字体的简写属性
  格式：font-size font-family
  默认行高

  font:50px serif;
  

  格式：font-size/line-height font-family

  font:50px/2 serif;
  

  格式：font-weight font-size/line-height font-family

  font:bold 50px/2 serif;
  

  格式：font-style font-weight font-size/line-height font-family

  font:italic bold 50px/2 serif;
  

• text-align 文字水平对齐
  属性值：left、right、center、justify(两边对齐)
• vertical-align 文字垂直对齐
  属性：top、middle、bottom、baseline(基线对齐，默认)
• 当插入一个图片时。默认是基线对齐，可以vertical-align:top;去掉多余部分
• text-decoration 文本修饰
  属性值：
  • none
    什么都没有
  • underline
    下划线
  • line-through
    删除线
  • overline
    上划线
• white-space
  设置如何处理元素内的空白
  属性值：
  • normal
    默认，自动换行
  • nowrap
    文本不会换行
  • pre
    保留空白
• text-overflow
  当文本溢出包含元素时发生的事情。
  属性值：
  • clip
    剪掉
  • ellipsis
    用省略号代替
• 例子：当文本超出包含块是自动替换成省略号。
  
  代码：

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;   
  

  三行代码，缺一不可