0

我在 rails 3.1 项目中使用 simple-form gem 和 twitter bootstrap。我有几个看起来都很好的表单视图。但是现在我喜欢在其中一种形式中设置文本输入字段的样式,这样它就变得更小了。文本输入字段位于我的一个名为“角色”的控制器的编辑表单视图中。表单的部分如下所示:

= simple_form_for @role, :html => { :class => 'form-horizontal' } do |f| 
  = f.error_notification
  = f.input :name
  = f.input :description
  .form-actions
    = f.button :submit, :class => 'btn-primary'
    = link_to t('.cancel', :default => t("helpers.links.cancel")), roles_path, :class => 'btn'

下面有一个样式文件:

app/assets/stylesheets/roles.css.scss

它是用脚手架命令创建的。我试图在此处添加一些样式,但这会导致我的应用程序的每种形式都发生变化。有没有一种好方法可以仅针对具有简单表单的一个特殊表单视图更改文本输入字段的样式?如果我希望输入文本字段的大小为:宽度 100 像素到高度 50 像素,我应该在哪里放置样式以及样式会是什么样子?

4

1 回答 1

1

即使您有一个仅用于角色的特殊 CSS 文件,您也需要知道这一点。最后,每个 CSS 文件都捆绑在一起并一起提供。这意味着,roles.css 将加载到每个页面上,这会导致您描述的行为。

如果你想为单个表单设置样式,你可以通过添加一个类来做到这一点:

= simple_form_for @role, :html => { :class => 'form-horizontal roles-form' } do |f| 

现在您可以将您的 CSS 定义范围限定为.roles-form,它们将仅适用于这个单一表单。

于 2012-12-31T13:57:17.193 回答