样式写的有点差,到时候参考下即可
核心: background: url(../../../public/us-icon.png) no-repeat; background-position: 0px 1px; 这两个样式
步骤:
第一步先设置盒子
第二步给盒子 宽, 高,背景图,浮动
第三步背景图定位 background:值1 值2,
第四步调盒子大小 transform:scale(值);
值0-n 大于1放大 小于1缩小
作品展示
页面代码
<div class="text">
<p href="javascript:;"> <span class="sp1"></span> 7天无理由退换货 </p>
<p href="javascript:;"><span class="sp1"></span>满99元全场包邮</p>
<p href="javascript:;"><span class="sp1"></span>100%品质保证</p>
</div>
css样式
.text {
height: 145px;
line-height: 145px;
display: inline-block;
display: flex;
align-items: center;
justify-content: space-around;
border-bottom: 1px solid #ccc;
p {
display: flex;
align-items: center;
color: white;
font-size: 20px;
margin: 0 12px;
}
.sp1{
width: 40px;
height: 40px;
padding-top: 5px;
background-color: red;
display: inline-block;
background: url(../../../public/us-icon.png) no-repeat;
background-position: 0px 1px;
}
}