引导4形式主题

编辑本页

警告:您正在浏览的文档欧宝官网下载appob娱乐下载Symfony 4.3,现已不再维护。

本页的更新版本用于Syob娱乐下载mfony 6.2(当前稳定版本)。

引导4形式主题

ob娱乐下载Symfony提供了几种将Bootstrap集成到应用程序中的方法。最直接的方法是添加所需的内容<链接>而且<脚本>你的模板中的元素(通常你只在其他模板扩展的主布局模板中包含它们):

1 2 3 4 5 6 7 8 9
{/ base.html #模板。树枝#}{#注意模板中的块可能命名不同#}{%head_css %}<!——从https://getbootstrap.com/docs/4.1/getting-started/introduction/#css复制CSS——>{%endblock%}{%head_js %}<!——从https://getbootstrap.com/docs/4.1/getting-started/introduction/#js复制JavaScript——>{%endblock%}

如果您的应用程序使用现代前端实践,那么最好使用它Webpack安可并遵循本教程将Bootstrap的源代码导入到SCSS和JavaScript文件中。

下一步是配置Symfony应用程序,以便在呈现表单时使用Bootstob娱乐下载rap 4样式。如果你想将它们应用到所有表单,定义以下配置:

  • YAML
  • XML
  • PHP
1 2 3
#配置/包/ twig.yaml枝:form_themes:(“bootstrap_4_layout.html.twig”)

如果希望在表单到表单的基础上应用引导样式,请包含form_theme在使用这些表单的模板中标记:

1 2 3 4 5 6 7 8
{#……#}{#这个标签只适用于这个模板中定义的表单#}{%form_theme“bootstrap_4_layout.html形式。嫩枝' %}{%身体%}<h1>用户注册:h1>{{form(form)}}{%endblock%}

可访问性

Bootstrap 4框架做得很好,使它可以用于视力受损和认知能力受损等功能变化。ob娱乐下载Symfony进一步确保表单主题符合WCAG 2.0标准

这并不意味着你的整个网站自动符合完整的标准,但它确实意味着你已经在你的工作中创造了一个设计所有用户。

自定义表单

Bootstrap 4有一个叫做“自定义表单_”的特性。您可以在Symfony Form上启用该功能ob娱乐下载RadioType而且CheckboxType通过添加一个名为radio-custom而且checkbox-custom分别。

1 2
{{form_row(形式。myRadio, {label_attr: {class: 'radio-custom'}})}}{{form_row(形式。myCheckbox, {label_attr:{类:'checkbox-custom'}})}}

标签和错误

当您使用Bootstrap表单主题并手动呈现字段时,调用了form_label ()对于复选框/单选字段不呈现任何东西。由于Bootstrap内部程序,标签已经由form_widget ()

呈现表单错误内部<标识>元素,以确保错误与其之间存在强连接<输入>的规定WCAG 2.0标准

此工作,包括代码示例,是根据创作共用BY-SA 3.0许可证。