li标签 - background:url() - 加自定义图片
<ul>
<li style=" list-style-type: none;
background: url(/xxx/xxx.png) 0px 0px / 33px 33px no-repeat;
padding-left: 33px;">
</li>
</ul>
.xx{
list-style-type: none;
background: url(/xxx/xxx.png) 0px 0px / 33px 33px no-repeat;
padding-left: 33px;
}
解释:
list-style-type去掉前面的点
background 的 url 就是图片路径
background 的 0px 0px 是偏移值
background 的 33px 是大小,自己控制,也可以用background-size
background 的 no-repeat 是不重复出现
padding-left: 33px; 是去掉默认给点的位置
background-size:contain;
// 缩小图片来适应元素的尺寸(保持像素的长宽比),是图片宽高最长的那个边覆盖元素一边即可;
background-size :cover;
// 扩展图片来填满元素(保持像素的长宽比),是图片宽高最短的那个边覆盖元素一边即可;
background-size :100px 100px;
// 调整图片到指定大小;
background-size :50% 100%;
// 调整图片到指定大小,百分比相对于包含元素的尺寸(并且并不需要包含元素显示设置宽高)