将边框底部添加到嵌套列表项 [英] add border-bottom to nested list items

问题描述

我想使用css为每个列表项添加底部边框。这是我的CSS代码：

I want to add a bottom border to every list item with css. Here is my CSS code:

ul,ol{
    li{
        list-style-type: none;
        margin: 0;
        padding: 0;
        padding-top: 3px;
        padding-bottom: 10px;
        margin-bottom: 10px;
        border-bottom: 1px solid #eeeeee;

        ul,ol{
            margin-left: 2em;
                li{
                    border-bottom: 1px solid #eeeeee;
                }
        }
    }
}

给出如下输出：

屏幕截图网址： http ：//oi34.tinypic.com/ih1eea.jpg

css代码在顶级项目上正常工作。但不是在子列表上。请参阅屏幕截图并帮助我。提前感谢。

The css code is working fine on top level item. But not on the sublists. Please see the screenshot and help me, Thanks in advance.

推荐答案

演示

向 code> say demo

.demo li {
   border-bottom: 1px solid #000;  
}

如果您希望网站中的每一个li都得到 border-bottom 这不是一个好主意。

If you want each and every li in your website should get border-bottom which won't be a great idea than use

ul li {
   border-bottom: 1px solid #000;
}

如果要缩进嵌套 li 您可以使用文本

If you want to indent your nested li you can use text

这篇关于将边框底部添加到嵌套列表项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！