微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

html – 使用CSS填写LI的整行

我有这些嵌套的ul和li。当我填充背景颜色时,嵌套的li留下缩进的部分白色。我有一些这样的李,从数据库填充,所以我不能给留给李的单个文本的余地。我如何做到这一点,使背景与缩进一起填满整个行?

现在看起来像这样

我想要这样

有什么建议怎么办?提前致谢。我不能更改html标记,因为我必须改变很多代码。有没有办法使用这个标记。这些li来自db查询,所以在这种情况下我没有确切的li数。

演示http://jsbin.com/uReBEVe/1/

解决方法

最好的办法是使用一种可以方便数据库管理,html和样式(CSS)的结构。

HTML:

<body>
<ul class="main">
    <li>1.</li>
    <li><ul>2</ul></li>
    <li><ul><li><ul>3.</ul></li></ul></li>
</ul>
</body>

CSS:

.main{
    position:relative;
    right:40px;
}
li{
    list-style:none;
    background:red;
    margin-top:1px;
}

Fiddle 1.

我不知道如果ul不包含li是有效的或无效的。如果它的无效,那么你可以使用:

<body>
<ul class="main">
    <li>1.</li>
    <li><ul><li>2</li></ul></li>
    <li><ul><li><ul><li>3.</li></ul></li></ul></li>
</ul>
</body>

Fiddle 2

原文地址:https://www.jb51.cc/html/232995.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐