jdango 中引入的bootstrap样式属性说明

本文详细介绍了Bootstrap框架中bootstrap_field属性的使用方法,包括layout、form_group_class、field_class、label_class、show_label等属性的设置,以及如何通过这些属性实现水平布局、控制大小、设置占位符等功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

查看方法:ctrl+B bootstrap_field属性。 
bootstrap_field属性:
使用样例:{% bootstrap_field form.ddl layout="horizontal"   %}

***layout="horizontal" :并排显示。如同没有field_class。
***form_group_class:(form-group)包含在field和label最外面的div样式。
***field_class:('col-md-9')包含field外的div样式。
***label_classg:('col-md-3')label元素样式。总是包含"control-label"样式。
***show_label:(True)是否显示field的label。注意,不能加引号。 show_label=False
*** size:控制大小:* ``'small'``* ``'medium'``* ``'large'``
*** placeholder :设置或重写placeholder。设置input标签中placeholder属性。
show_help:(True)如有field的help text文本,则显示。
label:重写label。仅调整label标签的文字内容。
horizontal_label_class:('col-md-3')layout="horizontal"时label的css样式。
horizontal_field_class:('col-md-9')layout="horizontal"时field的css样式。
addon_before :前置标记:'<span class="glyphicon glyphicon-calendar"></span>',参考URL:http://getbootstrap.com/components/#input-groups-basic
增加代码如下:
<div class="col-md-9"> #原有
    <div class="input-group">    #新增
        <span class="input-group-addon">#新增    #addon_before_class属性修改这里的CSS样式。
        <span class="glyphicon glyphicon-calendar"></span></span>#新增
        <input 原input标签> #原有
    </div>
</div>
addon_after :后置标记:
addon_before_class:(input-group-addon)addon_before属性的css样式。* ``'input-group-addon'``* ``'input-group-btn'``
addon_after_class:同addon_before_class。
error_css_class:(has-error).错误样式。
required_css_class:声明一个属性是必填时的样式。
bound_css_class:('has-success')绑定成功样式。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值