元素的层级
1.对于开启了定位的元素，可以用z-index属性指导元素的层级。
2.z-index需要一个整数作为参数，值越大元素的层级就越高，元素的层级越高越优先显示。
3.如果元素的层级一样，则优先显示靠下的元素。
4.祖先的元素的层级再高也不会盖住后代元素。
宏观上用浮动，细节微调用定位。
字体相关样式
1.color 用来设置字体颜色
2.font-size 字体的大小
-和font-size相关的单位：
-em 相当于当前元素的一个font-size
-rem 相对于根元素的一个font-size
3.font-family 字体族（字体的格式）
-可选值：
-serif 衬线字体
-sans-serif 非衬线字体
-monospace 等宽字体
-指定字体的类别，浏览器会自动使用该类别下的字体。
-font-family 可以同时指定多个字体，多个字体间使用,隔开，字体生效时优先使用第一个，第一个无法使用则使用第二个，以此类推。
5.font-face
-可以将服务器中的字体直接提供给用户去使用
@font-face {
/* 指定字体的名字 */
font-family:'myfont' ;
/* 服务器中字体的路径 */
src: url('./font/ZCOOLKuaiLe-Regular.ttf') format("truetype");
}
-问题：1.加载速度2.版权3.字体格式
6.图片放大会失真，字体是矢量不会。
图标字体（iconfont）
1.在网页中经常需要使用一些图标，可以通过图片来引入图标。但是图片大小本身比较大，并且非常的不灵活。 所以在使用图标时，我们还可以将图标直接设置为字体，然后通过font-face的形式来对字体进行引入，这样我们就可以通过使用字体的形式来使用图标。
2.fontawesome 使用步骤
-下载 https://fontawesome.com/
-解压
-将css和webfonts移动到项目中
-将all.css引入到网页中
3.使用图标字体
-直接通过类名来使用图标字体（class="fas fa-bell" class="fab fa-accessible-icon"）
-通过伪元素来设置图标字体
-找到要设置的图标的元素通过before或after选中
-在content中设置字体的编码
-设置字体的样式（有两种font-family）
-fab
-font-family: 'Font Awesome 5 Brands';
-fas
-font-family: 'Font Awesome 5 Free';
-font-weight: 900;
li::before {
content: 'f1d8';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
color: blue;
}
-通过实体来使用图标字体
-&#x图标的编码;
-例子：<span class="fas"></span>
4.使用阿里的图标字体库（iconfon）（推荐，使用方法与上相同）
学识浅薄，如有错误，恳请斧正，在下不胜感激。