共计 1646 个字符，预计需要花费 5 分钟才能阅读完成。
摘要：为了使你的网页看上去更好看，在这里你将会看到一些 CSS3 中罕用到的款式。非常适合初学者！大鹏一日同风起，扶摇直上九万里！一起学习，一起提高！
1、字体大小的单位
px（像素）：这是一个相对单位；em：1em 相当于以后父元素中的大写字母 M 的宽度；rem：成果跟 em 差不多，1rem 等于 HTML 中根元素的字体大小，而非父元素，反对新版本的浏览器，若用旧版本（IE8 及其以下版本）的还是倡议用前两种；
2、字体款式
font-style：normal(一般文本)/italic（斜体）；font-weight：nomal(一般字体)/bold（加粗）；text-transform：容许你设置转换的字体；
- none（避免任何转型）
- uppercase（将所有文本转为大写）
- lowercase（将所有文本转为小写）
- capitalize（所有单词首字母大写）
- full-width（所有字形转为全角）
text-decoration：设置 / 勾销字体上的文本装璜
- none（勾销已存在的任何文本装璜）
- underline（文本下划线）
- overline（文本上划线）
- line-through（删除线）
注：依照 line、style、color 容许设置多个值。
3、文字暗影
text-shdow：4px 4px 5px red;
- 属性 1：暗影与原始文本的程度偏移；
- 属性 2：暗影与原始文本的垂直偏移；
- 属性 3：含糊半径，值越高意味着暗影越宽泛；
- 属性 4：暗影的根底色彩；
注：正偏移向右挪动；负偏移向左挪动。
试一试多种暗影
text-shadow:-1px -px 1px #aaa,
0px 4px 1px rgba(0,0,0,0.5),
4px 4px 5px rgba(0,0,0,0.7),
0px 0px 7px rgba(0,0,0,0.4);
效果图如下：
4、文本布局
text-align：管制文本如何和它所在的盒子对齐
- left：左对齐；
- right：右对齐；
- center：居中文字；
- justify：使文本开展，使所有文本行的宽度雷同，这个属性要 审慎应用。
line-height：设置文本每行之间的高，能够设置无单位的值，line-height: 1.5;示意文本行高设置为字体高度的 1.5 倍。letter-spacing: 设置字母与字母之间的间距；word-spacing：设置单词与单词之间的间距；
p::first-line{
letter-spacing: 2px;
word-spacing: 4px;
}如下图，首句是设置了款式的，末句是没有设置款式的。
5、再来看一些比拟重要的属性
Font 款式 font-variant: 在小型大写字母和一般文本之间切换。font-kerning：开启 / 敞开间距选项；font-feature-settings：开启 / 敞开不同的 OpenType 字体个性；font-variant-alternates： 管制给定的自定义字体的代替字形的应用；font-variant-caps：管制大写字母代替字形的应用；
…
文本布局款式text-indent：指定文本内容的第一行后面应留出多少的空间；text-overflow：定义如何向用户示意存在被暗藏的溢出内容；white-space：定义如何解决元素外部的空白与换行；word-break：指定是否能在单词外部换行；
…
6、Font 简写
依照以下程序：font-style，,font-variant,font-weight,font-stretch,font-size,line-height,font-family。
其中，font-style，font-family必须指定；font-size和 line-height 之间必须放一个 正斜杠 。
一个残缺例子如下：
font: italic normal bold normal 3em/1.5 Helvetica,Arial,san-serif;以上均是参考最权威的 MDN Web Docs，总结进去的比拟重要的知识点，与君共勉。不妥之处，评论区欢迎您！
