如何格式化django评论的表单字段？

Question

我正在使用django为我生成的表单。我在博客中发帖后将其用作评论表单。

目前它渲染得很好，但它没有很好地对齐。 这就是我所拥有的。 这就是我想要的。

由于

编辑：这是我用户{{form.as_table}}

时的结果

Answer 1

我知道它有点晚了，但对于其他人你可以试试这个

<table>
{{ form.as_table }}
</table>

它解决了烦人的格式化问题，看起来很不错。

Answer 2

看看Customizing the form template。这是一种可能的解决方案。

也许您可以根据自己的喜好简单地使用CSS来设置表单样式和render the form。 （即 as_table（））。

Answer 3

发布我的解决方案希望它能帮助其他人继续。 我知道你用css设置字段的样式，但不知道如何为每个项目分配类。但是，如果您查看提供的默认模板，您会注意到在foreach循环中使用if语句将错误类分配给字段，该语句会自动生成表单中的每个字段。 即

{% for field in form %}    
< p{% if field.errors %} 
    class="error"
{% endif %}
    {{ field.label_tag }}<'/' p> 
{% endfor %}

所以我添加了这个功能。

< p{% if field.errors %} 
    class="error"
{% endif %}
{% ifequal field.name "honeypot" %} 
    id="hide"
{% else %}
     id="left"
{% endifequal %}>
    {{ field.label_tag }}<'/' p> 

我的css正在

#hide{
    display:none;

}

#left{
    width: 200px;
    text-align: left;

}

#right{
    width: 300px;
    text-align: left;

}

现在您可以设置类，您可以在css文件中轻松设置类或ID。这是评论。 如果您使用{{form.as_p}}或{{form.as_table}}来生成表单，那么您只需在css中设置一个通用表单类来设置它的样式。 即

form {
width: 350px;
padding: 20px;
border: 1px solid #270644;
}

Answer 4

使用默认{% render_comment_form for app.model %}将生成：

<p>
      <label for="id_name">Name</label> 
      <input id="id_name" type="text" name="name" maxlength="50">
    </p>
    <p>
      <label for="id_email">Email address</label> 
      <input type="text" name="email" id="id_email">

</p>
... etc

因此，您可以使用以下方法在CSS样式表中定位label：

label {
  width: 15%;
}

Answer 5

this post中详细介绍了多种方法，但是，我发现有时窗口小部件属性可能无法按照您想要的方式运行。

尽管如此，最简单的方法是使用CSS：

渲染包含表单字段的页面并进行一些检查（例如右键单击＆gt;检查或Chrome上的F12），以了解表单在呈现时生成的html标记。然后你可以轻松编写CSS。

您的表单中有input和textarea个字段，因此您的CSS将是：

input, textarea{
    width:350px;
}

请勿忘记在html模板顶部调用您的CSS文件：

<link rel="stylesheet" type="text/css" href="{% static 'styles/form.css' %}">

以下是我自己形式的快照：