繁体   English   中英

我怎样才能给背景图片李?

[英]how can I give background image to li?

边框图像未显示有人可以帮助我吗?

#sidebar li {
padding-left: 30px;
border-bottom: 1px dotted #4A3903;
background: url(images/example.PNG) no-repeat 15px 50%;
}

您要背景图片还是边框图片? 对于background-image,请使用background-image并引用您的网址:

#sidebar li {
   padding-left: 30px; 
   border-bottom: 1px dotted #4A3903; 
   background-image: url('images/example.PNG') no-repeat 15px 50%; 
}

对于border-image,请使用border-image:

 #sidebar li {
        padding-left: 30px; 
        border-bottom: 1px dotted #4A3903; 
        -webkit-border-image:url('border.png') 10 10 round;
        -o-border-image:url('border.png') 10 10 round; 
        border-image:url('border.png') 10 10 round;
     }

尝试添加

display: block;

以及您的样式。 (如果需要,内联块也可以工作)

我试过你的代码- DEMO

<div id="sidebar">
    <ul>
        <li></li>
    </ul>
</div> 

的CSS

#sidebar li {
padding-left: 30px;
border-bottom: 1px dotted #4A3903;
background: url(http://www.placehold.it/200x200) no-repeat 15px 50%;
}

但是background-image未显示为FULL。

当您向li标签添加与image相等的widthheight ,它将解决此问题。

#sidebar li {
padding-left: 80px;
border-bottom: 1px dotted #4A3903;
background: url(http://www.placehold.it/50x50) no-repeat 0px 0px;
width:auto;
height:50px;
list-style:none;
font-size:24px;
vertical-align: middle;
display: table-cell;
}

更新 - 演示

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM