一个班级如何有两种不同的颜色？答案

【问题标题】：How to have two different colors for one class?一个班级如何有两种不同的颜色？
【发布时间】：2015-05-31 00:23:20
【问题描述】：

我正在为btn 使用引导程序，所以在制作 div 类时我需要这个词。我们怎样才能使一个btn 黄色和另一个蓝色？我尝试使用id 来执行此操作。我哪里做错了？

谢谢！

_form

<%= button_tag(type: 'submit', class: "btn", id: "2") do %>
  <span class="glyphicon glyphicon-plus"></span>
<% end %>

<%= button_tag(type: 'submit', class: "btn") do %>
  <span class="glyphicon glyphicon-plus"></span>
<% end %>

css.scss

.btn {
background: #446CB3;
  #2 {
   background: black;
  }
border: #000;
border-radius: 8px;
font-family: verdana, arial, helvetica, sans-serif;
color: #ffffff;
font-size: 15px;
padding: 8px 18px 8px 18px;
text-decoration: none;
}

【问题讨论】：

标签： css ruby-on-rails twitter-bootstrap sass

【解决方案1】：

您的 css 选择器定位到 ID 为 2 的元素，该元素是 .btn 的子元素（.btn #2 不正确）。所以改成这样：

.btn {
background: #446CB3;

border: #000;
border-radius: 8px;
font-family: verdana, arial, helvetica, sans-serif;
color: #ffffff;
font-size: 15px;
padding: 8px 18px 8px 18px;
text-decoration: none;
}

#2.btn {
   background: black;
  }

【讨论】：

谢谢！我要在表格中添加什么？我尝试了#2.btn，但没有成功。
保持你的 html 不变。 css 选择器#2.btn 将选择.btn 类的元素和#2 的id，这正是你现在拥有的。
我无法让它为科比工作。我有这个：<%= button_tag(type: 'submit', class: "btn", id: 2 ) do %> 和这个.btn { background: #446CB3; &#2 { background: black; } 我错过了什么吗？谢谢先生！
抱歉，我错误地使用了 &（父）选择器。查看更新的答案。
不幸的是，Bryant 也没有用 :( 我也试过 2 上的引号和不带引号

【解决方案2】：

为什么不使用 Bootstrap 的按钮类？

http://getbootstrap.com/css/#buttons-options

根据您网站的配色方案（例如，您为“主”颜色设置的颜色），您可以执行以下操作：

类：“btn btn-primary”和类：“btn btn-warning”。这样您就不必更改 CSS 中的背景颜色或创建其他 ID。

【讨论】：

感谢您的回答！如果我不能得到我想要的确切颜色，那将是一个很好的备用计划，但我能够弄清楚。