Question

我在一个rails 3.1项目中使用simple-form gem和twitter bootstrap。我有几个表单视图，看起来都很好。但是现在我喜欢在其中一个表单中设置文本输入字段的样式，以便它变得更小。文本输入字段位于我的一个名为＆＃34; roles＆＃34;的控制器的编辑表单视图中。表单的部分内容如下所示：

= 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

是使用scaffold命令创建的。我尝试在这里添加一些样式，但这会导致我的应用程序的每种形式都发生变化。有没有一种很好的方法来改变一个文本输入字段的样式只为一个简单形式的特殊表单视图？我应该在哪里设置样式，如果我想要输入大小为100px到高度50px的输入文本字段，样式会如何？

Answer 1

你需要知道即使你有一个特殊的CSS文件只是为了角色。最后，每个CSS文件都捆绑在一起并一起提供。这意味着，roles.css将被加载到每个页面上，这将导致您描述的行为。

如果要为单个表单设置样式，可以通过添加类来执行此操作：

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

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

Rails简单形成不同形式的不同样式

1 个答案: