字体和文本

字体属性

指定字体系列

属性：font-family，取值：value1 value2

注意：字体取值包含中文或是特殊符号，要用双引号””引起来

eg：font-family:”宋体” Arial;

字体大小

属性：font-size，取值单位px，pt，em，rem等

eg：font-size:16px

字体粗细

属性：font-weight，

取值：1、normal，正常体，400

2、bold，加粗，900

3、400~900

eg：font-weight:bold

font-weight:700

字体样式

属性：font-style

取值：1、normal，正常体

2、italic，斜体

小型大写字母

针对英文字符，将小写字母变成大写母，但是大小还是跟原来的小写字母一样大

属性：font-variant

取值： 1、normal

2、small-caps

字体复合属性：font：style variant weight size family

注意：使用font属性的话，一定要加上family的值，否则没效果，其他属性没设置的话采用默认值

eg：font : 12px/1.5 Microsoft YaHei,Heiti SC,tahoma,arial,Hiragino Sans GB,"\5B8B\4F53",sans-serif;

文本属性

文本颜色

属性color，

取值：任意合法颜色

文本排列方式

属性text-align，指定当前元素中的文本、行内元素、行内块元素的水平对齐方式，

取值：left，right，center

文字修饰

属性text-decoration，指定文本的线条样式

取值：none(没有线条)，underline(下划线)，overline(上划线)，line-through(删除线)

行高

属性line-height，指定一行文本的高度。

如果行高高于文字本身大小，那么文本将在指定的行高范围内垂直居中显示

使用场合：1、设置一行文本垂直居中对齐，

2、设置行间距

首行文本缩进

text-indent，以px为单位

文字阴影

text-shadow：x y m color

x：水平偏移值，为正数时向右偏移，为负数时向左便宜

y：垂直偏移值，为正数时向下偏移，为负数时想上便宜

m：阴影模糊程度，不能是负数，如果值越大，阴影越模糊，反之越清晰，如果不需要模糊，可以设置为0

color：阴影的颜色，可以是rgba色

文本溢出

一行文本溢出

必须满足三个条件：

1、先强制一行内显示文本：white-space:nowrap;（normal是自动换行）

2、超出部分隐藏：overflow:hidden

3、用省略号代替超出的部分：text-overflow:ellipsis

多行文本溢出

多行文本溢出有较大的兼容性问题，适合于webkit浏览器或是移动端（大部分是webkit）

overflow:hidden;

text-overflow:ellipsis;

display:-webkit-box;

-webkit-line-clamp:2;

-webkit-box-orient:vertical