css定位相关知识

一、图标字体

图标字体（iconfont）

           -在网页中经常需要使用一些图标，可以通过图片来引入图标

           但图片本身比较大，也不灵活

           -所以使用图标时，我们还可以将图标直接设置为字体，

                然后通过font-face的形式来对字体进行引入

           -这样我们就可以通过使用字体的形式来使用图标

一个可以通过线上使用其图标

例：<link rel="stylesheet" href="./font_3717547_eaxs15v8gg4/iconfont.css”

二个可以通过线下使用其图标

例：<link rel="stylesheet" href="https://at.alicdn.com/t/c/font_3717547_klttj42c8v.css”

显现图标有三种方法：

第一种： 转义字符形式

<i class="iconfont s1">&#xe600;</i>

第二种：类名形式

<span class="iconfont icon-gouwuchetianjia "></span>

第三种：伪类

<i class="fa fa-envelope-open" aria-hidden="true"></i>

二、层级

1:如果定位元素的层级是一样，则下边的元素会盖住上边的

通过z-index属性可以用来设置元素的层级

可以为z-index指定一个正整数作为值，该值将会作为当前元素的层级

  层级越高，越优先显示

注意：

  对于没有开启定位的元素不能使用z-index

  父元素的层级再高，也不会盖住子元素

2:设置元素的透明背景

  opacity [əu'pæsiti] 可以用来设置元素背景的透明，

      它需要一个0-1之间的值

        0 表示完全透明

        1 表示完全不透明

        0.5 表示半透明