bookstrap表单的用法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>表单</title>
<script type="text/javascript" src="js/jquery-3.4.1.js" ></script>
<script type="text/javascript" src="js/bootstrap.js" ></script>
<link rel="stylesheet" href="css/bootstrap.css" />
</head>
<body>
<!--创建基本表单-->
<form role="form " >
<div class="form-group">
<label >姓名:</label>
<input type="text" id="username" class="form-control" />
<span id="userInfo"></span>
<label >密码:</label>
<input type="text" id="password" class="form-control" />
<input type="button" value="提交" class="btn btn-success"/>
<span id="passInfo"></span>
</div>
</form>
<!--进一步改进,创建水平表单-->
<form role="form" class="form-horizontal" >
<div class="form-group">
<div class="col-md-3" style="text-align: right;">
<label class="control-label">姓名:</label>
</div>
<div class="col-md-5">
<input type="text" class="form-control" />
</div>
<div class="col-md-4">
<label id="passInfo" style="color: red;" class="control-label">*输入格式不正确</label>
</div>
</div>
<div class="form-group">
<div class="col-md-3" style="text-align: right;">
<label class="control-label">密码:</label>
</div>
<div class="col-md-5">
<input type="text" class="form-control" />
</div>
<div class="col-md-4">
<label id="passInfo" style="color: red;" class="control-label">*输入格式不正确</label>
</div>
</div>
<div class="form-group" style="text-align: center;">
<input type="button" value="提交" class="btn btn-success"/>
</div>
</form>
</body>
</html>
bookstrap表单的用法相关推荐
- EASYUI 表单(FORM)用法
1,ajax提交只是简单的异步和文本提交.提交的数据需要序列化或程序指定.同时,数据也需要自己验证.如果使用easyui的验证组件validatebox,则需要在提交前调用,如下: if ($(&qu ...
- Validate 表单验证用法说明
前言 Validate 是 jQuery 的一个子插件, 该插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足用户的各种验证需求.该插件捆绑了一套有用的验证方法 ...
- html表单文本框作用,HTML表单的用法
在 HTML 中,表单是由 标记定界的区域,包含文本输入框.按钮.复选框和图形用户界面的其他功能部件.Web 应用程序使用表单以允许最终用户提供要发送到服务器的数据. form元素 常用属性: act ...
- php销售清单录入界面,列表,表格,商品清单表,注册表单的用法 2019年8月31日
1.谈谈你对html标签,元素与属性的理解,并举例说明. 2.列表有几种,如何定义? 3.列表与表格的区别与联系?什么时候用列表,什么时候用表格,为什么? 4.编程实现,用列表制作你的工作计划,要求使 ...
- Jquery ValidateEngine表单验证
Jquery ValidateEngine表单验证 用法:http://www.position-relative.net/creation/formValidator/demoValidators. ...
- Angular2+PrimeNG+Form表单
注:下面我说的Form表单的用法是在一个完整的项目中的用法 1.引入组件 在 app.module.ts 文件中引入组件,代码如下所示: import {FormsModule, ReactiveFo ...
- bui java,前端BUI框架表单教程
在开发后台的过程中,前后端需要频繁的通信,后台页面使用BUI模板,后端使用Java开发. BUI表单使用 BUI提供了4种表单布局,这四种表单布局,我觉得都可以使用 水平表单来替代.DIV本身就是一个 ...
- jQuery 表单验证插件，jQuery Validation Engine用法详解
jQuery 表单验证插件,jQuery Validation Engine用法详解 功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身 ...
- html如何让a标签提交表单提交,html post请求之a标签的两种用法解析
这篇文章主要介绍了html post请求之a标签的两种用法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧 html post请求之a标签的两种用法 ...
最新文章
- html作业三,3.15作业
- Android Support v4、v7、v13 介绍
- Jeremy Keith在 Fronteers 2010 上的主题演讲
- VMWare 8 安装 Mac OS 10.7 （Lion）版 【转】
- xposed 主动调用方法_操作方法：主动容量管理
- 第一次作业 四班05
- 为何 Emoji 能给产品设计(营销)带来如此大的数据增长？
- Android：Intent传递数据
- iOS开发之实现方法链调用
- 【交换机在江湖】第十四章 VLAN通信篇
- [963]Android app代理软件
- 天正电气lisp是什么文件_电气CAD绘图基础幻灯片
- 11 年膨胀 575 倍，微信为何从“小而美”变成了“大而肥”？
- 编程求解丢番图方程的原理
- python把PDF转换成图片
- 服务器系统控制台怎么打开,云服务器控制台怎么打开
- web前端学习路线-20个真实web开发项目集合
- 洛谷 P2895 [USACO08FEB]Meteor Shower S C++ BFS 广搜
- 三维点云数据特征检测
- 在组策略中设置从网络访问计算机选项,如何在组策略中设置“用户权利指派”策略？...