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. 【转】你应该关注的几个Eclipse超酷插件

    本文由 ImportNew - 唐尤华 翻译自 Anton Arhipov.如需转载本文,请先参见文章末尾处的转载要求. 来自非营利性Eclipse基金会的Eclipse IDE以其插件生态系统著称. ...

  2. JVM之JVM的体系结构

    一.JDK的组成 JDK:JDK是Java开发工具包,是Sun Microsystems针对Java开发员的产品.JDK中包含JRE(在JDK的安装目录下有一个名为jre的目录,里面有两个文件夹bin ...

  3. Eureka 主动下线服务

    原因: 测试环境由于机器换ip,神奇的出现了更新之前,之后的IP同时在Eureka上注册了. 方法一:直接停掉服务 默认情况下,如果Eureka Server在90秒没有收到Eureka客户的续约,它 ...

  4. C#与JavaScript中URL编码解码问题(转)

    混乱的URI编码 JavaScript中编码有三种方法:escape.encodeURI.encodeURIComponent C#中编码主要方法:HttpUtility.UrlEncode.Serv ...

  5. Java动态编译技术原理

    这里介绍Java动态编译技术原理! 编译,一般来说就是将源代码转换成机器码的过程,比如在C语言中中,将C语言源代码编译成a.out,,但是在Java中的理解可能有点不同,编译指的是将java 源代码转 ...

  6. Callable接口用法

    注意点:FutureTask是Runnable的实现类,它的构造器可以传Callable接口的实现类. 例子如下: class MyThread implements Callable<Inte ...

  7. python爬虫——urllib使用代理

    收到粉丝私信说urllib库的教程还没写,好吧,urllib是python自带的库,没requests用着方便.本来嘛,python之禅(import this自己看)就说过,精简,效率,方便也是大家 ...

  8. Nginx的踩坑实录

    1.昨天在为一个新项目配置地址转发,搞了很久都没生效,日志也没有问题,但就是没到转发的目标机器上. nginx.conf 配置如下: location /prism{ proxy_pass http: ...

  9. BeautifulSoup的简单用法

    官方文档加载比较慢(估计是我党的原因) https://www.crummy.com/software/BeautifulSoup/bs4/doc/index.zh.html#find-parents ...

  10. Ceph 之RGW Cache

    Overview 缓存是为达到系统快速响应的一项关键技术,Ceph 作为一个复杂的分布式存储系统,有多种.多级缓存存在.缓存按照位置分为: 客户端缓存 服务端缓存 网络中缓存 按照部署方式分为: 单体 ...