CSS字体样式属性

一、font-size:字号大小
该属性可以使用相对长度单位（推荐），也可以使用绝对长度单位，推荐使用像素单位px。

相对长度单位     说明
em                    相对于当前对象内文本的字体尺寸
px                     像素（推荐）
绝对长度单位     说明
in                      英寸
cm                    厘米
mm                  毫米
pt                     点

Tip：谷歌浏览器默认的字号大小是16 px。

[样例代码]
   <style>
    p{
        font-size: 16px;
    }

    </style>

二、font-family:字体
该属性用于设置字体，网页中常用的字体有宋体（比较适合印刷）、微软雅黑、黑体等。

[样例代码]
   <style>
    *{
        /*font-family: "微软雅黑";*/
        font-family: "Microsoft yahei",Arial;
    }
    </style>

小贴士：

• 1、现在网页中普遍使用14px+；
• 2、尽量使用偶数的数字字号，否则老的浏览器用奇数容易出现bug；
• 3、各种字体之间必须使用英文状态下的逗号隔开；
• 4、中文字体需要加英文状态下的引号，英文字体一般不需要加引号，当需要设置英文字体时，英文字体名必须位于中文字体名之前。
• 5、如果字体名中包含了空格、*、#、$、\等符号，则该字体必须加英文状态下的单引号或者双引号；
• 6、尽量使用习题默认字体，保证在任何用户的浏览器中都可以正常显示；
• 7、如果有多个字体，系统会逐个按照优先级去查找，如果一个都找不到（书写问题/浏览器兼容性），则使用浏览器默认字体；

CSS Unicode编码
在CSS直接使用Unicode编码来写字体名称可以避免一些浏览器不识别的问题，使其可以正确解析。

中文名英文名unicode

宋体	SimSun	\5B8B\4F53
黑体	SimHei	\9ED1\4F53
新宋体	NSimSun	\65B0\5B8B\4F53
楷体	KaiTi	\6977\4F53
微软正黑体	Microsoft JhengHei	\5FAE\x8F6F\6B63\9ED1\4F53
微软雅黑	Microsoft YaHei	\5FAE\8F6F\96C5\9ED1

三、font-weight:字体粗细
字体加粗除了使用b和strong标签外，还可以使用CSS来实现，但是CSS是没有语义的。
normal：正常字体（不加粗），相当于400
bold：粗体，相当于700
bolder：特粗体
lighter：细体
number：100/200/300...900 （建议用数字，解析起来更快）

[样例代码]

   <style>
    a{
        /*font-weight: bold;*/
        font-weight: 700; /* 没有单位 == bold */
    }
    </style>

四、font-style:字体风格
字体倾斜除了用i和em标签之外，还可以使用CSS来实现，但是CSS是没有语义的。
normal：正常字体（让斜体变正常）
italic：斜体

[样例代码]

   <style>
    em{
        color:skyblue;
        font-style: normal;
    }
    </style>

 

总结

以上是生活随笔为你收集整理的【温故知新】CSS学习笔记（字体样式属性）的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。