css字体属性和英文大小写转换

其实字体我们都会觉得它是一个小case，但是看了字体的详细文档，发现其实有些东西一直被我们忽略了，记录一些干货。

font-family:\5B8B\4F53,Arial Narrow,arial,serif;

上面这一段来自网易代码，第一次看到这个的时候很懵，不知道 \5B8B\4F53 代表什么，后来发现这个其实就是代表的是 宋体 其实直接写宋体也是可以的，但是中文在一些情况下会带来兼容性的问题，所以就写成这样了

字体名称属性(font-family)
就是设置是 什么字体

字体大小属性(font-size)

字体风格属性(font-style)
这个属性有三个值可 选：normal, italic, oblique。normal是缺省值，italic, oblique都是斜体显示。

字体浓淡属性(font-weight)
font-weight属性指定了字体的粗细程度。 一些字体只提供 normal 和 bold 两种值（我的魅族MX6手机上在字体设置为 无衬线字体sans-serif 时候 就只有normal和bold）
https://developer.mozilla.org/zh-CN/docs/Web/CSS/font-weight （mdn讲解font-weight）

英文字体大写属性(font-variant)
这个属性是把小写字体设置为 小大写，这个小大写就是字母是大写的，但是字号偏小（css1的属性，基本没有什么卵用）

实用的 大小写转换

      text-transform: uppercase;         /*英文字体大写*/
      text-transform: lowercase;        /*英文字体小写（默认就是这个）*/
      text-transform: capitalize;       /*英文首字母大写*/

2、字体行高和字间距
word-spacing : 单词与单词之间的间距
letter-spacing：字母与字母，和汉字与汉字
line-hight：1.2 （用这样表示自己大小的倍数），这样还比较好

3、文字两端对齐

文字两端对齐.png

 <p>我爱中国</p>
 <p>啦啦啦</p>
p{
    width: 100px;
    font-size: 20px;
    text-align: justify;
    text-align-last: justify;
    background-color: red;
}

3、设置了letter-spacing之后，text-align 就不居中了

加一个text-indent 属性并且把值设置成和letter-spacing一样 就可以了
text-indent属性本来是 设置段落的缩进值的。

letter-spacing: 100px;
text-indent: 100px;
text-align: center;