Question

我想在导航栏中显示btn（只显示切换）获取btn-info颜色。

我添加了一个btn-info类，
btn的文字颜色变为白色
和btn颜色没有变化。

我使用默认bootstrap 3 css。

bootply - click mobile view

    <a class="btn btn-info navbar-toggle" value="Page" href="javascript:win_memo('', '<?=$member[mb_id]?>', '<?=$_SERVER[SERVER_NAME]?>');" onfocus="this.blur()">
        <i class="glyphicon glyphicon-envelope"><sup style="margin-left:3px;"><?=$member[mb_memo_unread]?></sup></i>
    </a>

Answer 1

你需要使用（!important）作为你的btn-info属性值，因为（.btn-info）被（.navbar-toggle）类值覆盖，因此解决方案是将此代码添加到 custome.css 文件或 用于覆盖的任何文件main bootstrap.css 文件。

的码的

.btn-info { color: #fff; background-color: #5bc0de !important; border-color: #46b8da !important; }

希望这会对你有所帮助。

Answer 2

艾哈迈德纳的答案效果很好。好主意。

我添加了一个班级btn-info-navbar。

.btn-info-navbar {
color: #fff;
background-color: #5bc0de !important;
border-color: #46b8da !important;
}

并添加btn-info-navbar。

<a class="btn btn-info btn-info-navbar navbar-toggle" value="Page" href="javascript:win_memo('', '<?=$member[mb_id]?>', '<?=$_SERVER[SERVER_NAME]?>');" onfocus="this.blur()">
    <i class="glyphicon glyphicon-envelope"><sup style="margin-left:3px;"><?=$member[mb_memo_unread]?></sup></i>
</a>

在切换的导航栏中将btn颜色设为btn-info

2 个答案: