很抱歉再次打扰你们......我到处都在寻找这个问题的答案，但我似乎仍然无法弄清楚。
我需要更改 Bootstrap 中事件按钮的文本颜色。基本上，当您单击其中一个按钮时，它会从白色变为某种绿色，我想更改该颜色。有人知道我该怎么做吗？
我已经在 CSS 中试过了:
.button:focus, .button.active, .button.active:focus {
color: white !important;
}
然而，这并没有奏效。
(有人能告诉我如何在没有“运行代码”的情况下输入代码但它仍然正确着色吗？)
这是我的代码:
HTML:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.5/darkly/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.5/darkly/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<html lang="en">
<div class="navbar navbar-default navbar-custom navbar-fixed-top">
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav" id="dropdowns">
<a class="navbar-brand" id="brand">Traders: </a>
<li class="dropdown">
<a class="dropdown-toggle" aria-expanded="false">General <span class="caret"></span></a>
<ul class="dropdown-menu pull-left" role="menu">
<li><a href="#medical">Medical</a></li>
<li><a href="#utility">Utility</a></li>
<li><a href="#supplies">Supplies</a></li>
<li><a href="#banker">Banker</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" aria-expanded="false">Vehicles <span class="caret"></span></a>
<ul class="dropdown-menu pull-left" role="menu">
<li><a href="#aircraft">Aircraft </a></li>
<li><a href="#vehicle">Vehicle </a></li>
</ul>
</li>
<li class="button"><a href="#blackmarket">Black Market</a></li>
<li class="button"><a href="#wholesaler">Wholesaler</a></li>
<li class="button"><a href="#hero">Hero</a></li>
<li class="button"><a href="#bandit">Bandit</a></li>
</ul>
</div>
</div>
<body></body>
</html>CSS:
@media {
ul.nav li.dropdown:hover > ul.dropdown-menu {
display: block;
}
.navbar-custom {
color: #262626;
background-color: #262626;
}
.button:hover a{
color: white !important;
}
.navbar-default {
color: #262626;
background-color: #262626;
border-top: 4px solid red;
}
.navbar-default .navbar-brand:hover {
color: white;
}
.dropdown:hover a{
color: white !important;
}
.dropdown-menu > li > a:hover {
background-color: #3d3d3d;
}
}
body {
background-color: black;
}
#navbar {
width: 100%;
}最佳答案
CSS 有不同的伪选择器，你可以通过它来达到这样的效果。在您的情况下，您可以使用
:active :如果您只希望在单击按钮时使用背景色并且不想持续显示。
:focus:如果你想要背景颜色直到焦点在按钮上。
http://jsfiddle.net/zakCa/1017/
.button:focus
{
font-size: 13px;
color:orange;
}
关于html - Bootstrap 事件按钮文本颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35368383/