时间戳

首页 > 解决方案 > 引导表单控件类有什么用？

css - 引导表单控件类有什么用？

问题描述

我在思考如何使用form-controlBootstrap 提供的类的策略时遇到了麻烦。

一方面，我从 Bootstrap 文档中得到了这个相当平淡的评论：

文本表单控件（如输入、选择和文本区域）使用 .form-control 类进行样式设置。包括一般外观、焦点状态、大小等的样式。

参考：https ://getbootstrap.com/docs/4.0/components/forms/#form-controls

另一方面，我有相当杂乱的代码可供查看：

.form-control {
  display: block;
  width: 100%;
  height: $input-height;
  padding: $input-padding-y $input-padding-x;
  // ... 40-some lines elided ...
}

参考：https ://github.com/twbs/bootstrap/blob/275cd7f91eed9f4051d85c295e5c14ef08937804/scss/_forms.scss

我的问题：我如何从整体上修改现有代码或使用form-control.

标签： csstwitter-bootstrap

解决方案

您将该类添加到文本输入元素（输入、选择、文本区域），例如，<input type="email" class="form-control" value="" placeholder="Your email address" />这是 Bootstrap 强制表单元素看起来相同的方式。

CSS 之所以如此之长，是因为它们考虑了浏览器原生呈现这些元素的方式的所有差异。

推荐阅读