font属性

所有CSS字体属性

属性	描述
font	在一个声明中设置所有的字体属性
font-family	指定文本的字体系列
font-size	指定文本的字体大小
font-style	指定文本的字体样式
font-variant	以小型大写字体或者正常字体显示文本。
font-weight	指定字体的粗细。

字体颜色是color:;！！！不是font-color:;！！！

---

一、字体大小设置font-size:;

PS：

①虽然16px=1em=100%，但是推荐使用em做单位，这是w3c的标准，为的是避免Internet Explorer 中无法调整文本的问题。

②em会继承父元素的字体大小值，在基础上×N（N就是Nem的数值）

👉传送门：

①em、pt、px和百分比

②CSS之px、em、rem三者的联系与区别

二、字体样式设置font-style:;（斜体/正常）

PS：

①除非还需设置其他CSS样式属性，否则单纯斜体样式，建议使用斜体标签<em>

②误区！这个属性不是设置粗体的！

三、字体加粗设置font-weight:;（这个才是粗体）

PS：

①常用的值是“bold”，某些时刻才会用到细“lighter”（很少，细度一般就正常，不会更细）

②虽然粗度还有其它值，甚至是数字“100”~“900”（400=normal“正常”，700=bold“正常粗”），但，我尝试过了，900跟bold（700）没区别，所以只需要记住"bold"就够了

四、设置小型大写字母font-variant:;

PS：

①误区，并非改变字母大小写，而是把字母都变成大写，然后除第一个字母，其他都缩小。

②所以，这种属性的意义在哪？（或许可能对于某些情况有用，但...估计一些前辈开发几年都没用过，可能国外比较常用）

五、字体系列设置font-family:;

PS：

①其实定义字体组（字体系）不难理解，你想显示哪种字体，就先定义哪种字体，然后为了防止用户电脑没有你定义的字体，导致网页显示出错或者不美观，你再定义一些备用字体，最后为了稳妥起见，再定义个通用字体（通常字体）。

②常用指定字体，一般（属性值可别写中文）：微软雅黑、黑体、宋体、Arial（英文字体）等

②通用字体（通常字体）不多，也就这几种：serif（常用）、sans-serif（常用）、cursive、fantasy、monospace。

• 小米（MIUI）官网字体：font-family: MILanPro,Helvetica,Arial,sans-serif;
• 小米（mi）商城：font-family: Helvetica Neue,Helvetica,Arial,Microsoft Yahei,Hiragino Sans GB,Heiti SC,WenQuanYi Micro Hei,sans-serif;
• 美的（Midea）官网：font-family: ‘Microsoft Yahei’;
• 美的商城：font-family: ‘Lucida Grande’, Arial, ‘\5FAE\8F6F\96C5\9ED1’, ‘\5b8b\4f53’;
• 腾讯（.Tencent）官网：font-family: ‘PingFangSC-Regular’, ‘helvetica neue’, tahoma, ‘PingFang SC’, ‘microsoft yahei’, arial, ‘hiragino sans gb’, sans-serif;
• 腾讯（QQ）首页：font-family: ‘Microsoft Yahei’, ‘PingFang SC’, ‘Avenir’, ‘Segoe UI’, ‘Hiragino Sans GB’, STHeiti, ‘Microsoft Sans Serif’, ‘WenQuanYi Micro Hei’, sans-serif;
• 百度官网：font-family: Microsoft Yahei, Arial, Helvetica, sans-serif, serif;
• 百度知道：font-family: “Microsoft YaHei”,arial,courier new,courier,"\5b8b\4f53",monospace;

👉传送门：CSS,font-family,好看常用的中文字体

六、总属性font的设置

font 设置的顺序是：font-style(不常用) font-variant(不常用) font-weight(不常用) font-size/line-height(常设) font-family(常设)；
所以最终，也就： font: 大小size/行高 字体组; （注意先设字体大小，然后斜杠，再设行高。行高可不设，取默认值，需要时，才另设。）