django 我如何使用HTML和CSS使字段看起来是必填的

5us2dqdw  于 2022-12-20  发布在  Go
关注(0)|答案(3)|浏览(121)

我想使一个字段必填,但红色的 * 必填项出现在字段名称下方,我想就在字段名称旁边
下面是HTML代码

<div class="span12" id="propertytype">
    {% for field1 in propertytypeform %}   
    <p>
        <label> {{ field1.label_tag }}
            {% if field1.field.required %}
            <span class="required-field">*Required</span>
            {% endif %}
        </label>
        &nbsp;&nbsp;&nbsp; {{ field1 }} <br />
        { field1.errors }}
    </p>
    {% endfor %}                            
</div>

CSS文件

.required-field{
    color:red;  
    font-size:8px;
    /*position:absolute;
    top:-50;*/
}
2exbekwf

2exbekwf1#

<div class="field">
  <div class="fieldname">UserName<span class="mandatory">*</span></div></div>

现在您为类名必填项编写css代码

<style>
   .mandatory{color:red;}</style>
pkbketx9

pkbketx92#

渲染:{{ field1.label_tag }}是由一个<p>标签组成的。<p>标签是HTML中的一个块标签,所以它占据了页面宽度的100%。所以在字段{{ field1.label_tag }}旁边没有位置,所以它在下一行显示其余的内容。
这只是CSS的问题。
您可以做的是:

<span class="field">{{ field1.label_tag }}</span>

.field p {
  width: 200px;
}

这只是示例,但我建议您使用<div>来调整<p>的宽度

whlutmcx

whlutmcx3#

你也可以使用display:flex来获取标签中同一行的所有内容。所以你可以使用下面的代码吗?我希望它能帮助你。

#propertytype p label {
    display: flex;
}

如果您想了解有关flex属性的详细信息,请访问here

相关问题