知道为什么当我应用于display: inline-block
列表元素时,列表样式图像停止出现吗?
问问题
6543 次
3 回答
6
列表项最重要的样式属性是其display
默认值为list-item
. 该设置是元素与相应的list-style
. 设置display
为inline-block
删除有关列表项的唯一使其成为列表项的内容。
于 2012-04-13T15:07:52.167 回答
2
如果您希望列表元素使用 inline-block 但仍显示项目符号,则可以使用 ::before 伪元素和 content 属性:
li {
display: inline-block;
}
li::before {
content: '\25cf\a0';
}
( \25cf 是 Unicode 实心圆圈符号, \a0 是不间断空格)。
于 2013-12-31T09:22:10.090 回答
1
您可以使用 float:left; 在您的 li 元素上并添加最小宽度和最小高度
.footer ul li{
float: left;
list-style-image: url(../images/arrow.png);
margin: 0px 0px 10px 0px;
box-sizing: border-box;
min-height: 38px;
min-width: 300px;
}
于 2014-06-06T14:28:30.680 回答