前端之家收集整理的这篇文章主要介绍了
html – 垂直居中>带子弹图像的文字?,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
所以我试图弄清楚如何将我的一些文本与
自定义项目符号图像垂直对齐.这是我有的:
<ul>
<li>LINE OF TEXT</li>
<li>LINE OF TEXT</li>
<li>LINE OF TEXT</li>
</ul>
而对于CSS ……
#div .class
{
color: #4c361c;
font-size: 13px;
list-style-image: url(../images/image.png);
}
#div .class li{ }
有没有人知道怎么做这个?
这是一个
demo.
使用背景图像可以获得所需的效果.
HTML
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
CSS
ul {
list-style: none;
}
ul > li {
background: url('../imgpath/bullet-image.png') no-repeat left center;
/* Adjust the padding for your custom bullet image */
padding: 10px 0 10px 34px;
}
原文链接:https://www.f2er.com/html/225564.html