CSS字体属性（学习前端的第八天）

目录

font-family          字体

font-size             字号

font-weight         字体粗细  

font-style            字体样式

         字体复合属性（字体连写）

---

font-family   字体

 基本格式：       选择器 {font-family: "对应字体","对应字体";}

 h3 {
      font-family: '微软雅黑', '宋体'; /* 可以有多个字体，逐个读取 */
        }

<h3>第八天,CSS字体属性</h3>

*当有多个字体时，按顺序读取，如果第一个字体在系统中没有，则读下一个，以此类推，都找不到则以浏览器默认字体打开。

以上面例子，浏览器先读取微软雅黑，若在系统中没有微软雅黑字体，则读宋体以此类推。

font-size   字号

其中，通过body标签可以改变整个页面文字的大小，但是标题不会被改变，标题需要另设字体大小，注意数字后面要加单位（像素 px）。

 h3 {
            font-family: '微软雅黑', '宋体';
            font-size: 30px;
        }

font-weight 字体粗细  

让加粗的文字（标题）加细 400；（这个不用加，不要记混了，400为平常，700为加粗）

不加粗的文字加粗 700。

 h3 {
            font-family: '微软雅黑', '宋体';
            font-size: 30px;
            font-weight: 400;
        }

font-style 字体样式

格式：     p { font-style: normal };

normal(默认)         italic（倾斜）

 h3 {
            font-family: '微软雅黑', '宋体';
            font-size: 30px;
            font-weight: 400;
            font-style: italic;
        }

效果：

 字体复合属性（ 字体连写 ）

形如上面h3的css代码，还有另一种写法。

综合来写

         font： font-style    font-weight    font-size/line-height     font-family ;    (需要记住顺序)

 h3 {
          /* font: font-style font-weight font-size/line-height font-family;  */
          font: italic 400 30px 'Microsoft yahei', '宋体';
          /* 顺序必须得对应 */
        }

 效果也一样如下：

        且必须保留 font-size和 font-family （其他可以不选择）按照上面的例子就是写成：

font：30px 'Microsoft yahei'，'宋体'; /* 只保留了文字大小和风格 */

摆了摆了，越来越不想学了，摆几天先！