Question

嗨我想知道我是否可以减少边界底部的长度。我有一个div，我给了border-bottom：2px到那个div我想减少边框的长度。这可能吗。

我有这个导航栏，我已经给它的div想要减少边框的长度。我怎么能这样做。

这是我的HTML

               <div class="row">
        <div class="col-sm-12 col-xs-12 col-lg-12 col-md-12 welcome">
            <ul class="nav navbar-nav navbar-nav-primary">
                <li class="active">
                    <a href="#one" data-toggle="tab">
                        <i class="fa fa-map-marker" aria-hidden="true"></i> <span class="li-text">Location</span>
                    </a>
                </li>
                <li>
                    <a href="#two" data-toggle="tab">
                        <i class="fa fa-heartbeat" aria-hidden="true"></i> <span class="li-text">Heartbeats</span>
                    </a>
                </li>
                <li>
                    <a href="#three" data-toggle="tab">
                        <i class="fa fa-power-off" aria-hidden="true"></i>
                        <span class="li-text">Reboots</span>
                    </a>
                </li>
                <li>
                    <a href="#four" data-toggle="tab">
                        <i class="fa fa-compress" aria-hidden="true"></i>
                        <span class="li-text">Reconnects</span>
                    </a>
                </li>
                <li>
                    <a href="#five" data-toggle="tab">
                        <i class="fa fa-battery-full" aria-hidden="true"></i>
                        <span class="li-text">Charge</span>
                    </a>
                </li>

            </ul>

        </div>

这是我的CSS

        .welcome {
              border-bottom: 2px solid #bcbcbc;
              margin-left: 10px;
             }

Answer 1

将欢迎类移到ul标记中，它应该按照您的意愿执行：）

Answer 2

从班级欢迎中删除 border-bottom css 并使用它;

ul.nav.navbar-nav.navbar-nav-primary {
    border-bottom: 2px solid #ddd;
}
.welcome {
    margin-left: 10px;
}

Answer 3

您可以将此设置为设置高度和设置长度的宽度

SELECT

减少边框底部长度

3 个答案: