css - 如何更改一个 DIV 字段而不影响其他字段？

Question

小问题，我的 Rails 应用程序中有一个表单，其中包含许多字段，但所有字段名称都与其表单相同，对吗？

代码:

 <div class="field">
  <%= f.label :to %>
  <%= f.text_field :to, :class => 'address-picker-input' %>
 </div>

现在对于某些字段，我希望表单宽度更短，单独自定义每个字段的最佳方法是什么？

Answer 1

如果要单独自定义每个字段，请为每个字段创建一个类。但是 CSS 的一个好处是你可以重用它。所以你可以尝试定义一些类的字段。

添加另一个类:

<div class="field shorter">

然后在你的 CSS 上:

.field.shorter {
  width: 100px;
}