Question

我喜欢Bootstrap tabbable导航的功能，但我想在每个标签上设置背景图片和文字。事实上，我真正喜欢的是将我的photoshop图像放在每个标签中，并将活动状态设置为我选择的图像。

我很难做到这一点。是否需要进行大量的自定义工作才能使用此组件？

我以为我可以尝试一些CSS，但它没有给我正确的格式我想要：

ul.nav.nav-tabs li {
    display:inline-block;
    background:url(../images/skypeIcon.png) no-repeat left center;
    background-size:20px auto;
    font-size:15px;
    padding:2px 0 2px 28px
}

顺便说一句，我使用的是Bootstrap 2.3，所以我不能使用Bootstrap 3 Navbar Generator。

Answer 1

我可以在我的标签中使用div标签，并在其中放置我想要的任何内容。

<ul class="nav nav-tabs">

            <li class="active">

                <a href="#tab1" data-toggle="tab">

                    <div>

                        <img src="<%=context%>/images/defaultAvatar.png"/>

                        <br/>

                        Computer

                    </div>

                </a>

            </li></ul>

样式Bootstrap tabbable导航

1 个答案: