简单表格 - 输入后出现标签

Question

我有一个简单的表格标签，如下所示：

= f.input :email, required: true, input_html: {class: 'md-input'}, wrapper_html: {class: 'md-form-group float-lable'}

并生成以下HTML

<div class="input email required user_email md-form-group float-lable">
 <label class="email required" for="user_email">
  <abbr title="required">*</abbr> Email
 </label>
 <input class="string email required md-input" type="email" value="" name="user[email]" id="user_email">
</div>

如何调整Simple Form标签，使标签元素出现在输入元素之后？

我已经尝试了inline_label但是这似乎没有用，因为它不是为了这个目的而打算

Answer 1

作为第一步，您可以将自定义样式应用于标签：

label_html: { class: 'custom-label' }

并且取决于设计用途，例如css float: right;

Answer 2

简单表单使您可以访问f.input_field和f.label。您可以轻松地执行以下操作：

.md-form-group.float-lable
  = f.input_field :email, class: 'md-input'
  = f.label :email

这会在输入字段后使用“简单表单”呈现标签。