使用伪类快速定位一个图标

.items li{
  height: 1.2rem;
  font-size: .373333rem;
  position: relative;
  padding-left: .693333rem;
  margin-left: .4rem;
  border-bottom: .026667rem solid #e4e4e4;
  line-height: 1.2rem;
}
.items li::before{
  content: '';
  display: block;
  width: .426667rem;
  height: .426667rem;
  position: absolute;
  left: .026667rem;
  top: .346667rem;
  background-size: cover;
}
.address::before{
  background-image: url('./img/address.png');
}
.money::before{
  background-image: url('./img/money.png');
}
.email::before{
  background-image: url('./img/email.png');
}
.question::before{
  background-image: url('./img/question.png');
}

li是长条格子，她的position必须是relative，因为下面的伪类是以向上第一个position为relative的父元素来定义自己的absolute定位的，li：：before里的是公用的，下面的address之类为不同的图片，但和上面的伪类指的是同一个元素，注意伪类一定要有content属性，然后这里我们用了display：block因为里面是一张图片