欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

第七篇.表单_html/css_WEB-ITnose

程序员文章站 2022-06-10 11:19:54
...
Bootstrap提供了三种表单布局:垂直表单,内联表单和水平表单

创建垂直或基本表单:

  • ·向父
    元素添加 role="form"。
  • ·把标签和控件放在一个带有 class .form-group 的
    中。这是获取最佳间距所必需的。
  • ·向所有的文本元素
  • placeholder="请输入名称">

    这里是块级帮助文本的实例。

    请打勾

    内联表单:

    内联表单中所有元素都向左对齐,标签并排,要创建内联表单,需要在form标签中加入class

    .form-inline

    placeholder="请输入名称">

    请打勾

    显示效果如下:

    注意:默认情况下,Bootstrap 中的 input、select 和 textarea 有 100% 宽度。在使用内联表单时,需要在表单控件上设置一个宽度。

    水平表单:和其它两种表单有所不同,要创建水平表单需要遵循以下步骤.

  • 向父
    元素添加 class .form-horizontal。
  • 把标签和控件放在一个带有 class .form-group 的
    中。
  • 向标签添加 class .control-label。
  • 例如:

    placeholder="请输入名字">

    placeholder="请输入姓">

    请记住我

    第七篇.表单_html/css_WEB-ITnose

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。

    相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 第七篇.表单_html/css_WEB-ITnose
  • 专题推荐

    相关标签: 第七篇.表单

    上一篇: 验证码图片不显示

    下一篇: php 把数字转换成汉字的代码,php数字汉字代码_PHP教程

    推荐阅读