4. CSS进阶

@规则

at-rule:@规则、@语句、css语句、css指令

@import "./reset.css";

1. import
   @import “路径”
   表示导入另外一个css文件

在network中可以看见加载的css文件

2. charset

@charset “utf-8”;
这个指令必须要写到第一行;
告诉浏览器该css文件，使用的字符编码集是utf-8

web字体与图标

web字体

解决用户电脑上没有安装相应字体的问题

font-family:‘翩翩体-简’, ‘微软雅黑’, sans-serif;

当用户电脑上没有安装相应字体，强制让用户下载该字体，放到服务器上的

ttf后缀名文件–字体文件

使用font-face制作一个新字体

@font-face{
font-family:‘good night’;
src:url(‘字体文件存放的位置’);

}

后面设置font-family的时候，就下载该字体----临时下载，第二次访问重新下载

ctrl + r强制刷新

因为中文字体文件一般较大，所以应用不多
考虑用户体验

字体图标库：iconfont.cn

添加图标到项目之后. 复制在线链接—在线链接省略了协议名