Question

	<div class="container">
	  <h2>Log</h2>
	  <div class="panel-group">
		<div class="panel panel-default">
		  <div class="panel-heading">
			<h4 class="panel-title">
			  <a data-toggle="collapse" href="#collapseLog">Logger</a>
			</h4>
		  </div>
		  <div id="collapseLog" class="panel-collapse collapse">
			<div class="panel-body"> 
				<label for="comment">Log:</label>
				<textarea class="form-control" rows="5" id="comment"></textarea>
			</div>
		  </div>
		</div>
	  </div>
	</div>

我正在尝试创建一个WSocket记录器，我正在尝试将字体的颜色更改为绿色，将背景更改为灰色

在样式中执行此操作完全更改背景：

textarea{ 
    background-color:gray !important;
}

但如果我尝试设置text-font Color，请执行以下操作：

textarea{ 
    background-color:gray !important;
    color: #fff;
}

doenst work ...

我怎样才能做到这一点？

谢谢！

Answer 1

您应该在textarea上使用更强的选择器来覆盖bootstrap css。例如：

#comment {
  color: #fff;
}

PS：显然你也可以在那条线上使用！important，但这是非常罕见的情况，否则被认为是（非常）糟糕的做法。我会说即使使用#id也有点过分。

以下是关于选择器特异性的精彩指南： selector specifities and strengths

textarea中的文本颜色引导程序

1 个答案: