对同一页面上的两个 html 表单文本区域/输入进行不同的样式设置答案

【问题标题】：Style two html form text area/inputs on same page differently对同一页面上的两个 html 表单文本区域/输入进行不同的样式设置
【发布时间】：2015-11-24 02:53:07
【问题描述】：

我的网站上有两个表单，但我正在努力为它们设置不同的样式。

我希望网站上的所有文本区域/输入都具有相同的样式，除了一个表单。

所以网站上的所有表单都使用这个 css...

input, textarea {
    background-color:#eae7e7 !important;
}

如何按照以下方式更改另一个表单的背景颜色？

<div class="form-group">
<input type="email" class="form-control input-sm" id="name" placeholder="Your Name">
</div>

.form-control 输入，.form-control textarea 好像不起作用？

【问题讨论】：

【解决方案1】：

一种简单的方法是在相关表单中添加一个 id：

<div class="form-control" id="my-form">

然后，在 css 中设置输入样式：

#my-form input {your-style:value;}

【讨论】：

【解决方案2】：

.form-control input, .form-control textarea

好像你有这样的代码：

<div class="form-control">
   <input>
</div>

你的 CSS 选择器应该是这样的：

input.form-control, textarea.form-control don't forget the `!important` when you apply the css property

【讨论】：

【解决方案3】：

试试：

input.form-control {
    background-color: #000 !important;
}

您还必须将 !important 添加到您的 CSS 中，以便覆盖应用于 input, textarea 的样式。但是，如果可能，您应该完全删除 !important，除非 100% 有必要。

【讨论】：