脆皮形式:为输入之一添加 css 类
[英] crispy-forms: add css class for one of the inputs
本文介绍了脆皮形式:为输入之一添加 css 类的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在我的 forms.py 我有
<代码>[...]self.helper.layout = 布局(字段('姓名')，字段('说明')，)self.helper.form_class = 'form-horizontal'self.helper.label_class = 'col-md-2 col-xs-3'self.helper.field_class = 'col-md-10 col-xs-9'[...]渲染到
<label class="control-label col-md-2 col-xs-3 requiredField" for="id_name">名称</标签<div class="controls col-md-10 col-xs-9"><input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
<div id="div_id_description" class="form-group"><label class="control-label col-md-2 col-xs-3 requiredField" for="id_description">描述<div class="controls col-md-10 col-xs-9"><textarea id="id_description" class="textarea form-control" rows="10" name="description" cols="40"></textarea>
现在我希望只是名称输入更小，就像这样:
<代码>[...]<div class="controls col-md-8 col-xs-7"><input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
[...]
(如何)在 crispy-forms 中可以实现这一点?
解决方案
我看到两种可能性:
1.使用 CSS
#div_id_name {字体粗细:0.8em；}
2.覆盖字段模板
您可以覆盖字段模板 你所在的领域:
Field('field_name', template='my_field_template.html')
有关参考字段模板，请参阅site-packages/crispy_forms/templates/bootstrap3/field.html.
(3. 等待)
Github 上有一个未解决的问题:https://github.com/maraujop/django-crispy-forms/issues/348
In my forms.py I have
[...]
self.helper.layout = Layout(
Field('name'),
Field('description'),
)
self.helper.form_class = 'form-horizontal'
self.helper.label_class = 'col-md-2 col-xs-3'
self.helper.field_class = 'col-md-10 col-xs-9'
[...]
which renders to
<div id="div_id_name" class="form-group">
<label class="control-label col-md-2 col-xs-3 requiredField" for="id_name">
Name
</label
<div class="controls col-md-10 col-xs-9">
<input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
</div>
</div>
<div id="div_id_description" class="form-group">
<label class="control-label col-md-2 col-xs-3 requiredField" for="id_description">
Description
</label>
<div class="controls col-md-10 col-xs-9">
<textarea id="id_description" class="textarea form-control" rows="10" name="description" cols="40"></textarea>
</div>
</div>
Now I would like just the name-input to be smaller, like this:
[...]
<div class="controls col-md-8 col-xs-7">
<input id="id_name" class="textinput textInput form-control" type="text" name="name" maxlength="20">
</div>
</div>
[...]
(How) can this be achieved in crispy-forms?
解决方案
I see two possibilities:
1. Use CSS
#div_id_name {
font-weight: 0.8em;
}
2. Override the field template
You can override the field template of your field:
Field('field_name', template='my_field_template.html')
For a reference field template, see site-packages/crispy_forms/templates/bootstrap3/field.html.
(3. Waiting)
There's an open issue on Github for this: https://github.com/maraujop/django-crispy-forms/issues/348
这篇关于脆皮形式:为输入之一添加 css 类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
