教你如何设计Django的样式以及如何添加class
每个使用django的人都知道django表单的优点。但是，当你第一次使用它时，一般会出现一个问题：我该如何设计它的样式？如何添加class？
是的，其实有一种方法（实际上很简单），就是必须使用widgets（小部件）。
什么是widgets：widgets是django对html输入元素的表示。widgets处理html的呈现，并从与widgets相对应的get / post字典中提取数据。
换句话说，widgets只是定义如何将内容呈现为html的一种方法。因此，例如，charfield具有默认的textinput小部件，该小部件呈现为《input type =“ text”》。
但是小部件是可自定义的，因此还可以设置诸如文本区域的大小之类的内容，或者该字段是否将成为必填字段等等。
因此，让我们尝试构建一个示例来展示实际使用的小部件。
假设我们有一个名为userinfoform的表单来获取用户名以及他的电子邮件。
from django import formsclass userinfoform（forms.form）： name = forms.charfield（） email = forms.emailfield（）
html看起来像这样：
《div class=“container”》《h1》form《/h1》《form action=“{% url ‘index’ %}” method=“post”》 {% csrf_token %}《div class=“form-group”》 {{ form }}《/div》《div class=“form-group”》《input class=“btn btn-success” type=“submit” value=“submit”》《/div》《/form》《/div》
目前，此表单使用默认的窗口小部件，并且没有任何样式，因此基本上，它看起来像这样：
看着还可以，但是它仍然可以改进，我们可以向其中添加一个bootstrap类。我们可以通过在attrs字典中声明一个类来做到这一点。
from django import formsfrom django.forms import textinput， emailinputclass userinfoform（forms.form）： name = forms.charfield（widget=forms.textinput（attrs={‘placeholder’： ‘name’， ‘style’： ‘width： 300px;’， ‘class’： ‘form-control’） email = forms.emailfield（widget=forms.emailinput（attrs={‘placeholder’ ：‘email’， ‘style’： ‘width： 300px;’， ‘class’： ‘form-control’）
我们添加了一个bootstrap类，然后看结果：
但是通常当我们使用django表单时，这些表单与某种模型相关，而现在这种表单却没有。为此，我们需要进行一些更改。我们现在将使用小部件类。窗口小部件类具有基本的属性attrs，就像上面的示例一样。我们还必须添加一个名为meta的新类，并指定与该表单相关的模型的名称，我们要拥有的字段以及这些字段的小部件。
from django import formsfrom django.forms import modelform， textinput， emailinputfrom .models import userclass userinfoform（modelform）：class meta： model = user fields = ［‘name’， ‘email’］ widgets = {‘name’： textinput（attrs={‘class’： “form-control”，‘style’： ‘max-width： 300px;’，‘placeholder’： ‘name’ }），‘email’： emailinput（attrs={‘class’： “form-control”， ‘style’： ‘max-width： 300px;’，‘placeholder’： ‘email’ }） }
那么这是怎么回事？我们之前使用的charfield和emailfield是内建字段类，但是如果要使用widgets类，则需要使用内建控件，在此示例中，这些控件是textinput和emailinput。最终它们将工作相同，但配置会略有不同。
该表单基本上与以前的表单相同，它没有改变其呈现方式或其他任何方式，但现在此表单已连接到user模型，该模型是用于存储用户信息的模型。 html看起来像这样：
《div class=“container”》《h1》form《/h1》《form action=“{% url ‘index’ %}” method=“post”》 {% csrf_token %}《div class=“form-group”》 {{ form.name }}《/div》《div class=“form-group”》 {{ form.email }}《/div》《div class=“form-group”》《input class=“btn btn-primary” type=“submit” value=“submit”》《/div》《/form》《/div》
最后结果：
写在最后： 学习如何使用窗口小部件非常有用，因为现在你知道如何使这些表单看起来更好，并且添加bootstrap类非常简单，这很方便。
文章转载：python运维技术
（版权归原作者所有，侵删）
中软国际亮相马来西亚WCIT 2023，全面展现数智化创新成果
继电器的附加电路——并联二极管电路
Neuralink公司的人脑与人工智能同步技术带来怎样的影响与预期
低成本大容量的QLC SSD的性能和寿命被人质疑
居家养老提质怎样可以加快脚步
教你如何设计Django的样式以及如何添加class
如何加快推进“温州智造”高质量发展？智能制造能给温州带来什么？
SAS：常用字符处理函数介绍
5G还没正式商用，6G又来了？
小鹏G3新能源汽车怎么样，权威测评诠释硬核品质
智能经济成为我国经济高质量发展的有力支撑
盘中孔工艺有多大价值？
一种能够检测光信号并将其转换为电信号的光电器件
Dapp开发及智能合约部署技术
移动电源做UL2056 检测报告有哪些测试要求
如何用万用表测量三线制传感器
科技头条：机器人加快实体店提货速度，三星收购ai公司Kngine
索赔5.2亿？芯片巨头高通专利门
5G时代给手机品牌提出了更高的技术要求
看门狗电路图说明
是的，其实有一种方法（实际上很简单），就是必须使用widgets（小部件）。
什么是widgets：widgets是django对html输入元素的表示。widgets处理html的呈现，并从与widgets相对应的get / post字典中提取数据。
换句话说，widgets只是定义如何将内容呈现为html的一种方法。因此，例如，charfield具有默认的textinput小部件，该小部件呈现为《input type =“ text”》。
但是小部件是可自定义的，因此还可以设置诸如文本区域的大小之类的内容，或者该字段是否将成为必填字段等等。
因此，让我们尝试构建一个示例来展示实际使用的小部件。
假设我们有一个名为userinfoform的表单来获取用户名以及他的电子邮件。
from django import formsclass userinfoform（forms.form）： name = forms.charfield（） email = forms.emailfield（）
html看起来像这样：
《div class=“container”》《h1》form《/h1》《form action=“{% url ‘index’ %}” method=“post”》 {% csrf_token %}《div class=“form-group”》 {{ form }}《/div》《div class=“form-group”》《input class=“btn btn-success” type=“submit” value=“submit”》《/div》《/form》《/div》
目前，此表单使用默认的窗口小部件，并且没有任何样式，因此基本上，它看起来像这样：
看着还可以，但是它仍然可以改进，我们可以向其中添加一个bootstrap类。我们可以通过在attrs字典中声明一个类来做到这一点。
from django import formsfrom django.forms import textinput， emailinputclass userinfoform（forms.form）： name = forms.charfield（widget=forms.textinput（attrs={‘placeholder’： ‘name’， ‘style’： ‘width： 300px;’， ‘class’： ‘form-control’） email = forms.emailfield（widget=forms.emailinput（attrs={‘placeholder’ ：‘email’， ‘style’： ‘width： 300px;’， ‘class’： ‘form-control’）
我们添加了一个bootstrap类，然后看结果：
但是通常当我们使用django表单时，这些表单与某种模型相关，而现在这种表单却没有。为此，我们需要进行一些更改。我们现在将使用小部件类。窗口小部件类具有基本的属性attrs，就像上面的示例一样。我们还必须添加一个名为meta的新类，并指定与该表单相关的模型的名称，我们要拥有的字段以及这些字段的小部件。
from django import formsfrom django.forms import modelform， textinput， emailinputfrom .models import userclass userinfoform（modelform）：class meta： model = user fields = ［‘name’， ‘email’］ widgets = {‘name’： textinput（attrs={‘class’： “form-control”，‘style’： ‘max-width： 300px;’，‘placeholder’： ‘name’ }），‘email’： emailinput（attrs={‘class’： “form-control”， ‘style’： ‘max-width： 300px;’，‘placeholder’： ‘email’ }） }
那么这是怎么回事？我们之前使用的charfield和emailfield是内建字段类，但是如果要使用widgets类，则需要使用内建控件，在此示例中，这些控件是textinput和emailinput。最终它们将工作相同，但配置会略有不同。
该表单基本上与以前的表单相同，它没有改变其呈现方式或其他任何方式，但现在此表单已连接到user模型，该模型是用于存储用户信息的模型。 html看起来像这样：
《div class=“container”》《h1》form《/h1》《form action=“{% url ‘index’ %}” method=“post”》 {% csrf_token %}《div class=“form-group”》 {{ form.name }}《/div》《div class=“form-group”》 {{ form.email }}《/div》《div class=“form-group”》《input class=“btn btn-primary” type=“submit” value=“submit”》《/div》《/form》《/div》
最后结果：
写在最后： 学习如何使用窗口小部件非常有用，因为现在你知道如何使这些表单看起来更好，并且添加bootstrap类非常简单，这很方便。
文章转载：python运维技术
（版权归原作者所有，侵删）
中软国际亮相马来西亚WCIT 2023，全面展现数智化创新成果
继电器的附加电路——并联二极管电路
Neuralink公司的人脑与人工智能同步技术带来怎样的影响与预期
低成本大容量的QLC SSD的性能和寿命被人质疑
居家养老提质怎样可以加快脚步
教你如何设计Django的样式以及如何添加class
如何加快推进“温州智造”高质量发展？智能制造能给温州带来什么？
SAS：常用字符处理函数介绍
5G还没正式商用，6G又来了？
小鹏G3新能源汽车怎么样，权威测评诠释硬核品质
智能经济成为我国经济高质量发展的有力支撑
盘中孔工艺有多大价值？
一种能够检测光信号并将其转换为电信号的光电器件
Dapp开发及智能合约部署技术
移动电源做UL2056 检测报告有哪些测试要求
如何用万用表测量三线制传感器
科技头条：机器人加快实体店提货速度，三星收购ai公司Kngine
索赔5.2亿？芯片巨头高通专利门
5G时代给手机品牌提出了更高的技术要求
看门狗电路图说明