html - 在不更改类的情况下将 Bootstrap 表单样式应用于 div 元素

Question

我正在使用下面的约定构建一个包含许多表单元素的屏幕；它使我免于添加 class='...'每个输入、按钮和选择框。

.formDiv button {
  font-family: verdana;
  font-size: 10px;
  border: 1px solid #999;
  border-radius:3px;
}

.formDiv input {
  font-family: verdana;
  border: 1px solid #999;
  width: 110px;
}

现在我想使用bootstrap；我已经配置好了一切；确认它正在工作。是否可以在不添加 class='some-bs-style' 的情况下应用 bootstrap3 样式每个表单元素？理想情况下，我想做这样的事情:

.myDiv input {
   //use bs3 input styling
}

.myDiv select {
   //use bs3 select styling
}

我看到 bootstrap 使用 form-control ，所以我尝试使用以下方法在父 div 上设置它:

<div id='#formdiv' class='form-control'>

..但是没有用；我很讨厌 CSS，所以这不足为奇。

Answer 1

从 form-control 复制规则并将规则应用于输入并选择是否要自动将其用于您的 formdiv 类:

.formdiv input, select {
RULES FROM FORM CONTROL
}

DEMO HERE

更新的演示 + CSS 在这里:http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.css

复制是必要的，因为你不能从其他类继承规则。因此，如果你想避免对每个输入和选择应用表单控件样式，你必须使用上面的方法。但这仍然比将“表单控制”放入每个表单中的每个输入要快。