<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>bootstrap form</title>
<link rel="stylesheet" href="../bootstrap-3.3.7/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="../bootstrap-3.3.7/plugin/bootstrap-table/bootstrap-table.min.css" />
<script src="../assets/js/jquery-2.1.4.min.js"></script>
<script src="../bootstrap-3.3.7/dist/js/bootstrap.min.js"></script>
<script src="../bootstrap-3.3.7/plugin/bootstrap-table/bootstrap-table.min.js"></script>
<script src="../bootstrap-3.3.7/plugin/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
</head>
<body>
<div class="container">
<div class="row" >
<div class="col-xs-6" style="background-color: #dedef8; box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">
<form role="form" class="form-vertical">
<div class="form-group" >
<label for="name">名称</label>
<input type="text" class="form-control" id="name" placeholder="请输入名称">
</div>
<div class="form-group">
<label for="age">年龄</label>
<input type="text" class="form-control" id="age" placeholder="请输入年龄">
</div>
<div class="form-group">
<label for="sex">性别</label>
<div class="checkbox-inline">
<label><input type="checkbox" name="sex" value="1">男</label>
</div>
<div class="checkbox-inline">
<label><input type="checkbox" name="sex" value="2">女</label>
</div>
</div>
<div class="form-group">
<div class="radio">
<label>
<input type="radio" name="optionsRadios" value="option2" checked> 女
</label>
</div>
</div>
<div class="form-group">
<label for="remark">备注</label>
<textarea class="form-control" id="remark" placeholder="请输入备注" rows="3"></textarea>
</div>
<div class="form-group">
<span class="help-block">
提醒,如果你没有什么,就不要输入了。
</span>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
分享到:
相关推荐
bootstrap表单验证
对于刚开始使用bootstrap前台框架的朋友来说,表单验证或许是必不可少的。本案例中有常见的格式校验公大家参考,好不容易找到了,给需要的朋友分享一下,不需要积分,有个csdn账号即可,免去积分下载的困扰
bootstrap表单验证插件,简易配置参数,即可验证表单,非常好用,欢迎下载。
Laravel-Bootstrap-Modal-Form, 使用AJAX提交模式中的Bootstrap 表单,使用 Laravel 验证 Laravel-Bootstrap-Modal-Form你的Laravel 应用程序的表单验证扩展插件。 在将 Bootstrap 窗体嵌入到 Bootstrap/jquery模式...
用bootstrap的栅格“ coll-md- ”命令设置宽度总是不尽人意,有时上下框对不齐,有时上下宽度又不齐,这时建议用“style=”width:100px” “ <form class=form-horizontal > <label class=col-sm-2 ...
Twitter Bootstrap表单验证.zip
BForms, 用于 ASP.NET MVC的Bootstrap 表单 Bootstrap 支持 ASP.NET MVC控件BForms开源框架由一个由 ASP.NET MVC 。Javascript 。Javascript和自定义CSS组成的Collection 框架组成,它扩展了 Twitter
一款不错的基于bootstrap表单登录模板
表单控件——文本域textarea</title> <!-- 最新版本的 Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css
10.Bootstrap表单样式3.rar
09.Bootstrap表单样式2.rar
08.Bootstrap表单样式1.rar
基于Bootstrap表单验证,供大家参考,具体内容如下 GitHub地址:https://github.com/chentangchun/FormValidate 使用方式: 1.CSS样式 .valierror { border-color: red !important; } .tooltip.right .tooltip-...
下面给大家分享bootstrap表单验证实例代码,具体代码如下所示: <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ include file="../include/taglib....
全面解析了Bootstrap表单的使用方法,本文重点介绍Bootstrap表单控件,感兴趣的小伙伴们可以参考一下
formvalidation是一款功能非常强大的基于Bootstrap的jQuery表单验证插件。该jQuery表单验证插件内置了16种表单验证器,你也可以通过Bootstrap Validator's APIs写自己的表单验证器。
全面解析了Bootstrap表单的使用方法,本文重点介绍Bootstrap表单按钮,感兴趣的小伙伴们可以参考一下
主要为大家详细介绍了BootStrap表单的制作代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
表单常见的元素主要包括:文本输入框、下拉选择框、单选框、复选框、文本域、按钮等。接下来通过本文给大家介绍Bootstrap表单组件教程,感兴趣的朋友一起学习吧