首页 > 编程知识 正文

html无序列表,html无序列表代码

时间:2023-05-03 07:27:13 阅读:193068 作者:2548

6 个答案:

答案 0 :(得分:1)

您需要以下内容:

然后只需添加padding:0的

.right-block ul li {

list-style: none;

background: url(http://www.clipartbest.com/cliparts/7Ta/pbq/7TapbqgGc.png) 0 5px no-repeat;

background-size: 20px;

background-position: left center;

font-size: 20px;

padding: 8px 29px;

}

.right-block ul {

padding: 0;

}

Categories WordpressWordpressWordpress

答案 1 :(得分:0)

我拿了你的代码而只用用另一张图片替换了背景图片,它确实有效。

因此,要么你在CSS规则中有一个padding-left,你没有在这里发布,或者你的图像在其右侧包含一个大的(透明的,因此不可见的)空间。

.right-block ul li {

list-style: none;

background: url(http://placehold.it/14x14/00f) 0 5px no-repeat;

font-size: 14px;

line-height: 20px;

margin-bottom: 10px;

padding: 0 0 0 16px;

}

Categories WordpressWordpressWordpress

答案 2 :(得分:0)

试试这个:





.right-block ul {

padding: 0;

}

.right-block ul li {

list-style: none;

font-size: 14px;

line-height: 20px;

margin-bottom: 20px;

}

.right-block ul li:before {

content: " ";

background-image:url(http://pages.cs.wisc.edu/~powerjg/files/bullet_triangle_grey.png);

background-size: 30px 20px;

background-repeat: no-repeat;

display: inline-block;

width: 30px;

height: 20px;

vertical-align: middle;

margin-right: 10px;

}

Categories WordpressWordpressWordpress 



答案 3 :(得分:0)

尝试在完整列表中添加边距或填充。如果这不起作用,您可以尝试为图像提供最大宽度。如果它低于100%将缩短右侧的宽度。不要以为这会解决它。

答案 4 :(得分:0)

添加margin& Padding上的0 ul

.right-block ul

{

padding:0;

margin:0;

}

答案 5 :(得分:0)

默认情况下ul标记从左侧获取60px填充





.right-block ul {

padding-left: 0px;

}

.right-block ul li {

list-style: none;

background: url(https://placeholdit.imgix.net/~text?txtsize=5&txt=10%C3%9710&w=10&h=10&txtpad=1) 0 5px no-repeat;

font-size: 14px;

line-height: 20px;

margin-bottom: 10px;

padding: 0 0 0 16px;

}

Categories WordpressWordpressWordpress 



版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。