Bootstrap 1填充0不工作



我试图将padding设置为0 px用于li标签内的超链接,但它不起作用。如果我把它设置在内嵌为特定的超链接,然后它工作良好。

<div class="container">
    <div class="row">
        <div class="col-xs-2">
            <ul class="nav nav-pills nav-stacked ">
                <li class="active"><a href="nokia-phones-1.php">Nokia</a></li>
                <li><a href="samsung-phones-9.php">Samsung</a></li>
                <li><a href="motorola-phones-4.php">Motorola</a></li>
                <li><a href="sony-phones-7.php">Sony</a></li>
            </ul>
        </div>
    <div class="col-xs-10">
        <h2>Most Viewed</h2>
    </div>
    </div>
</div>
CSS

@import url("http://netdna.bootstrapcdn.com/bootswatch/3.1.1/cerulean/bootstrap.min.css");
@import url("http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css");
li a {
padding: 0px;
}
http://jsfiddle.net/TxdAm/

我甚至试过

ul li {    padding: 0px;}

li  {    padding: 0px;}

a  {    padding: 0px;}

但是它仍然不能工作。

如何将padding设置为0px对于unordered list内部的超链接

你需要重写bootsrap的类,只需添加以下CSS规则:

.nav > li > a {
    padding: 10px 0;
}

在Bootstrap中,这个规则的值是10px 15px,所以这个应该可以修复它。

你可以尝试在CSS规则中使用!important

li a {
    padding: 0px !important;
}

它会工作的。有关的更多信息!important: look here

相关内容

  • 没有找到相关文章

最新更新