HTML与CSS之文字文本

一.文字(font)

1.font-weight 文字着重

  bold      加粗
  normal    正常 

例如font-weight: bold;

2.font-style 文字倾斜

  italic    倾斜
  normal    正常  

例如: font-style: italic

3.font-size 文字大小(一般为偶数)

  50px      数字加单位
  默认字体大小为16px

例如:font-size: 50px;

4.font-family 字体(中文默认为宋体)

   格式:英文字体，"中文字体"//英文字符使用英文字体，中文字符使用中文字体

例如:font-family: charcoal,"楷体";

5.line-height 文字行高

行高代表一行文字在容器中所占的高度

如果行高的值与容器相等，那么文字就会竖直垂直居中

ps:测量多行文字的行高的方法：

        1.首先要知道文字的大小
        2.用ps测量两行文字之间的距离
        3.拿上面测量出来的距离除以2
        如果行高为奇数，文字的上边距少一像素，下边距多一像素

6.文字的复合样式：

格式:
font:font-weight font-style font-size(必需)/font-weight font-family(必需)
（顺序不能乱）
例如:
font: bold italic 26px/50px "微软雅黑";
font: 26px "微软雅黑";

二.文本(text)
1.color 颜色
值为几种颜色的表示方式
2.text-align 文本对齐方式

  left   左对齐(默认)
  center 居中对齐
  right   右对齐     

3.text-indent 首行缩进(em缩进字符)

  12px  缩进12像素
  1em   空出1个字符
  2em   空出2个字符
  em根据字体大小来计算的，字体不管怎么变1个em始终缩进一个字体大小

4.text-decoration 文本修饰

  underline     下划线
  overline      上划线
  line-through  中划线
  none           无    

5.letter-spacing 字母间距

  10px    数字加单位

6.word-spacing 单词的间距(以空格间距)

  10px   数字加单位(文本中的字需要用空格隔开)

7.white-space 强制不换行

  nowrap   不换行
  normal    换行
  英文与数字如果没有结束的话是不会换行的

8.word-break 词内换行

  break-word   让单词换行
  break-all    所有都不换行
  normal       正常

ps：空格有多大？

在宋体下，空格的大小是一个字体大小的一半，默认为8px