如何更改引导程序的井颜色？答案

【问题标题】：How can I change the bootstrap's well color?如何更改引导程序的井颜色？
【发布时间】：2014-03-04 03:59:24
【问题描述】：

好吧，我一直在尝试更改引导程序的井颜色，但它不起作用，我尝试将图像设置为背景（井的）并且它有效，但这不是我需要的。这是我的 HTML 代码：

<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>
Default.aspx
 </title>
<script src="Scripts/jquery-1.11.0.js" type="text/javascript"></script>    
<link href="Styles/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="Styles/bootstrap-theme.css" rel="stylesheet" type="text/css" />   
<link href="Styles/Default.css" rel="stylesheet" type="text/css" /> 
<script src="Scripts/bootstrap.js" type="text/javascript"></script>    
<script src="Scripts/Default.js" type="text/javascript"></script>
</head>
<body>
<div class="well well-lg"><h1 class="">TIDE File Generation</h1></div>
<div id="mainNavigator">
    <ul class="nav nav-tabs">
      <li><a href="/TideFileGeneration.aspx">Validate file</a></li>
      <li><a href="/ImportCatalogs.aspx">Catalogs</a></li>
      <li><a href="/InvoiceHistory.aspx">View History</a></li>
      <li><a href="/Reports.aspx">Reports</a></li>
    </ul>
</div>
 </body>
 </html>

这是我的 CSS 代码：

.well{
background-color: rgb(22, 105, 173);
}

在文件Default.css中

谢谢和问候。

【问题讨论】：

这不起作用？ jsfiddle.net/sVQsg
不，我的意思是，我可以更改除颜色以外的所有内容。我认为我的语法有问题，或者这不是应该更改颜色的地方。
我明白了，伙计们：不应该在那里。非常感谢。
我很困惑，但我很高兴你找到了一些有用的东西。万一您在旧版本的 IE 中进行测试，有一个背景颜色错误需要留意：css-tricks.com/ie-background-rgb-bug
谢谢。我从来没有听说过，但我按照 Micallef 所说的做了（在他说之前），这就是我发现问题所在的方式。谢谢@JasonSperske

标签： html css twitter-bootstrap background-color

【解决方案1】：

引导程序 3：

设置背景属性而不是背景颜色。

.well {
    background: rgb(22, 105, 173);
}

【讨论】：

谢谢！有人碰巧知道井类的默认十六进制颜色是什么？
背景色：#f5f5f5
@MattO'Brien 否则有一个rgb()在线颜色选择器here。
我发现 this page 帮助我选择了我想要的颜色。

【解决方案2】：

应该可以。

尝试检查 Chrome 中的元素以确定其他 css 是否覆盖了背景颜色。默认情况下 .well 已经包含背景颜色 - 请确保您正在替换它。

【讨论】：

【解决方案3】：

您还可以在默认 CSS 中使用 !important 来覆盖井的背景颜色：

.well{
background-color: cyan !important;
}

这对我有用。

【讨论】：

【解决方案4】：

您可以在声明井的 div 中添加样式。

您的代码：

<div class="well well-lg"><h1 class=""> TIDE File Generation</h1></div>

建议代码：

<div class="well well-lg" style="background-color: (color of choice);">
    <h1 class=""> TIDE File Generation</h1>
</div>`

【讨论】：

虽然这将“修复”一个问题，但这违背了 CSS（层叠样式表）的目的。不仅如此，他的问题在于 CSS 语法，而不是“div 定位”