bootstrap 表单类

表单美化

用法: 向父元素 <form role="form"></form>     添加 role="form"

   把标签和控件放在   .form-control 类的div里面

   向所有的文本元素   input  textarea   seclect   添加类   .form-control

  

三种表单布局类:  垂直表单(默认)    内联表单     水平表单

摘自菜鸟教程 
默认表单
<form role="form">
<div class="form-group">
<label for="name">名称</label>
<input type="text" class="form-control" id="name" placeholder="请输入名称">
</div>
<div class="form-group">
<label for="inputfile">文件输入</label>
<input type="file" id="inputfile">
<p class="help-block">这里是块级帮助文本的实例。</p>
</div>
<div class="checkbox">
<label>
<input type="checkbox">请打勾
</label>
</div>
<button type="submit" class="btn btn-default">提交</button>
</form> 内联表单 需要对里面的元素宽度进行设置

bootstrap 表单类的更多相关文章

  1. 详解Bootstrap表单组件

    表单常见的元素主要包括:文本输入框.下拉选择框.单选框.复选框.文本域.按钮等.下面是不同的bootstrap版本: LESS:  forms.less SASS:  _forms.scss boot ...

  2. 第二百三十四节,Bootstrap表单和图片

    Bootstrap表单和图片 学习要点: 1.表单 2.图片 本节课我们主要学习一下 Bootstrap 表单和图片功能,通过内置的 CSS 定义,显示各 种丰富的效果. 一.表单 Bootstrap ...

  3. Bootstrap表单

    Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) -> 这个不好看,都是手机版了,PC版占一排不好看: 内联表单 -> 我相信这个才是你想要的,PC版响应横排,手机版响应竖 ...

  4. bootstrapValidator.js,最好用的bootstrap表单验证插件

    前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...

  5. bootstrap表单带验证

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  6. bootstrap 表单控件 控件状态 控件大小 help-block

    bootstrap 表单控件 控件状态 控件大小 help-block <!DOCTYPE html> <html lang="en"> <head& ...

  7. 基于Bootstrap表单验证

    基于Bootstrap表单验证 GitHub地址:https://github.com/chentangchun/FormValidate 使用方式: 1.CSS样式 .valierror { bor ...

  8. web(四)html表单类标签

    表单类标签 操作者用于输入信息,并将信息提交给服务器的标签集合. 表单标签介绍 form标签:表单元素(其余标签)标签的容器标签 input标签:用于用户信息输入的标签. button标签:按钮标签. ...

  9. Python的Django框架中forms表单类的使用方法详解

    用户表单是Web端的一项基本功能,大而全的Django框架中自然带有现成的基础form对象,本文就Python的Django框架中forms表单类的使用方法详解. Form表单的功能 自动生成HTML ...

随机推荐

  1. maven中scope标签各个值的意义

    在使用maven配置时,有时候会见到scope这个标签,但是总是记不住他们所对应的含义,现在整理一下,以后忘记了再来查看. 版权声明:本文为CSDN博主「MrZhangBaby」的原创文章,遵循 CC ...

  2. 2020 年 Java 程序员应该学习什么?

    大家好,我相信大家在新的一年都有一个良好的开端,并准备好制定一个提升自我技术的目标.作为 Java 开发人员,我还制定了一些目标,希望在今年成为一名更好的 Java 开发人员. 如果你尚未制定目标,这 ...

  3. ENS 域名注册表智能合约(ENSRegistry.sol)解析

    ENS 注册表合约是 ENS 系统中的核心合约,了解这个合约可以敲开我们理解 ENS 域名系统的大门. 打开下面的折叠区域可以查看用 Solidity 语言编写的详细代码.当前部署在以太坊中的 ENS ...

  4. springboot整合apache ftpserver详细教程(看这一篇就够了)

    原创不易,如需转载,请注明出处https://www.cnblogs.com/baixianlong/p/12192425.html,否则将追究法律责任!!! 一.Apache ftpserver相关 ...

  5. C++Primer第五版 3.5.1节练习

    练习 3.27:假设txt_size是一个无参数的函数,它的返回值是int.请回答下列哪个定义是非法的?为什么? Unsigned buf_size = 1024; (a) int ia[buf_si ...

  6. 最近发现Git的速度好慢

    最近发现Git速度好慢,Git Bash要等5秒左右才能操作,网上查了查原因,说是火绒的问题,哎平时也用不到,看日志一个毒都没光顾过我电脑,火绒卸载! 卸了后果然快多了

  7. 网络流 - 最大流构图入门 bzoj 1305

    一次舞会有n个男孩和n个女孩.每首曲子开始时,所有男孩和女孩恰好配成n对跳交谊舞.每个男孩都不会和同一个女孩跳两首(或更多)舞曲.有一些男孩女孩相互喜欢,而其他相互不喜欢(不会“单向喜欢”).每个男孩 ...

  8. go微服务框架kratos学习笔记四(kratos warden-quickstart warden-direct方式client调用)

    目录 go微服务框架kratos学习笔记四(kratos warden-quickstart warden-direct方式client调用) warden direct demo-server gr ...

  9. SpringCloud Zipkin

    原文地址:https://blog.csdn.net/z8414/article/details/78600646 Zipkin是一个链路跟踪工具,可以用来监控微服务集群中调用链路的通畅情况 前提:S ...

  10. [CCPC2019 ONLINE]E huntian oy

    题意 http://acm.hdu.edu.cn/showproblem.php?pid=6706 思考 打表出奇迹. 注意到这个式子有一大堆强条件限制,最后化为: $$\frac{1}{2}\sum ...