覆蓋Django中的表單模板樣式

我是django的新手，我在django上構建了一個表單，並發現了構建在表單中的django並實現了它。覆蓋Django中的表單模板樣式

從django文檔中，它說form.subject會在其中放入一個<input type="text">。但是如果我想改變這個輸入元素的屬性，比如高度，字體，文本，寬度等，該怎麼做。

{{ form.non_field_errors }} 
<div class="fieldWrapper"> 
    {{ form.subject.errors }} 
    <label for="{{ form.subject.id_for_label }}">Email subject:</label> 
    {{ form.subject }} 
</div> 
<div class="fieldWrapper"> 
    {{ form.message.errors }} 
    <label for="{{ form.message.id_for_label }}">Your message:</label> 
    {{ form.message }} 
</div> 
<div class="fieldWrapper"> 
    {{ form.sender.errors }} 
    <label for="{{ form.sender.id_for_label }}">Your email address:</label> 
    {{ form.sender }} 
</div> 
<div class="fieldWrapper"> 
    {{ form.cc_myself.errors }} 
    <label for="{{ form.cc_myself.id_for_label }}">CC yourself?</label> 
    {{ form.cc_myself }} 
</div>

來源

2014-12-29 Muhammad Taqi

爲此使用jquery。

每個django表單元素都有其唯一的id。使用該ID來應用使用jQuery的CSS屬性。

使用ID訪問表單元素。

$('#id_subject').addClass('form-group'); # formgroup is a bootstrap class. 
or 
$('#id_subject').css('height', '10px');

應用您想要的任何css屬性。該屬性應該在頁面加載後應用，即在jquery中的document.ready上。

來源

2014-12-29 13:03:19 Gaurav

正如指出的documentation您可以添加CSS類：

class CommentForm(forms.Form): 
    name = forms.CharField(widget=forms.TextInput(attrs={'class': 'special'}))

假設你熟悉CSS，你可以將樣式應用於該領域現在。

有一種方式來設置所有的小部件，但它需要更好地瞭解python和django。

另一種替代方法是使用一些django的應用程序，允許此，像crispy-forms或floppy-forms

來源

2014-12-29 13:28:06 cdvv7788

覆蓋Django中的表單模板樣式

回答

相關問題