字体样式

1. 字体颜色

color: rgba(255,255,255,0.5); 字体颜色

1. 英文单词, 如：red、green、deeppink
2. 十六进制 , 如：#ffffff(#fff)、#000000(#000), 十六进制颜色都是六位，如果六位的值都一样，可简写为三位
3. rgb, 如：rgb(0, 0, 0) 其中三个值的范围是0-255
4. rgba, 如：rgba(0, 0, 0, 0.5), 最后一个参数(0.5)是透明度0-1

2. 字体大小

浏览器默认的字体是16px,最小是12px

font-size: 30px;
font-size: 2em;
font-size: 2rem;

1. px 单位：可以通过px我单位设置字体大小，浏览器默认字体大小是16px，最小12px，最大无上限。
2. em 单位：默认字体的大小(16px)的倍数，如 2em = 32px
3. rem 单位：html字体大小的倍数，默认的html字体大小也是16px

3. 字体样式

font-style: normal; 默认
font-style: italic; 斜体

font-weight: normal; 默认
font-weight: bold; 加粗

4. 字体类型

font-family: '华文行楷';
font-family: '微软雅黑';
font-family: '华文中宋', '华文行楷', '微软雅黑'; (如果不支持第一个，就显示第二个，直到最后都不支持显示浏览器默认字体)

line-height: 100px; 字体垂直居中
text-align: center; 字体水平居中
text-align: justify; 字体左右对齐

5. 导入字体类型

@font-face {
    font-family: "xiaowei";
    src: url("../font/小微logo体.otf");
}

导入后可直接使用

font-family: 'xiaowei';

6. 复合属性

font: 20px '华文行楷';
font: 20px '';
font: 20px/40px ''; 大小/行高 字体类型
font: bold 20px/40px ''; 加粗 大小/行高 字体类型
font: bold italic 20px/40px ''; 加粗 斜体 大小/行高 字体类型
注释: 属性值可以缺省，但是最少要保留 字体大小与字体类型

7. 实际技巧

1. 文本超出隐藏

   text-overflow: ellipsis; /* 字体超出用省略号进行修饰 */
   overflow: hidden; /* 超出隐藏 */
   white-space: nowrap; /* 强制的不换行 */