bootstrap3 input 验证样式【转】
feedback
<form role="form">
<div class="form-group has-success has-feedback">
<label class="control-label" for="inputSuccess1">成功状态</label>
<input type="text" class="form-control" id="inputSuccess1" placeholder="成功状态">
<span class="help-block">你输入的信息是正确的</span>
<span class="glyphicon glyphicon-ok form-control-feedback"></span>
</div>
<div class="form-group has-warning has-feedback">
<label class="control-label" for="inputWarning1">警告状态</label>
<input type="text" class="form-control" id="inputWarning1" placeholder="警告状态">
<span class="help-block">请输入正确信息</span>
<span class="glyphicon glyphicon-warning-sign form-control-feedback"></span>
</div>
<div class="form-group has-error has-feedback">
<label class="control-label" for="inputError1">错误状态</label>
<input type="text" class="form-control" id="inputError1" placeholder="错误状态">
<span class="help-block">你是输入的信息是错误的</span>
<span class="glyphicon glyphicon-remove form-control-feedback"></span>
</div>
</form>
效果图:

bootstrap3 input 验证样式【转】的更多相关文章
- input range样式更改,模拟滑块
input range 样式更改,js模拟滑块实时更新数据. 效果图: html 代码: <div> <span class="slider"></s ...
- input输入样式,动画
模板描述:input输入样式 动画,有输入框也有搜索框的样式,多种多样,大家根据自己的喜欢来. 找网站SEO教程,网站模板,以及想要建立个人博客的朋友来涂志海个人博客网,这里有你想要的一切(万一没有的 ...
- 自定义input file样式
自定义input file样式:一般都是通过隐藏input,通过定义label来实现.这种做法要注意的是label的for属性要指定input对应的id; <!DOCTYPE html> ...
- input的样式简介
<input type="text" autocomplete="off" placeholder="" x-webkit-speec ...
- html input验证只能输入数字,不能输入其他
html input验证只能输入数字,不能输入其他 此方法为借鉴别人的,在此只做记录. <input type="text" onkeyup="if(!/^\d+$ ...
- input:file样式怎样修改
问题描述: 我需要点击input:file来修改img中的图片,但是input:file样式太丑 解决办法: 给file设置透明度为0,让用户看不见他 创建新的button按钮 修改button按钮样 ...
- input file样式修改,图片预览删除功能
本篇对input file进行了修改,改成自己需要的样式,类似验证身份上传身份证图片的功能. 效果图如下: 这里主要展示上传预览图片功能,对于删除功能的html及css写的比较粗糙,对于想要精细表现这 ...
- Html-IOS下input的样式添加不上的解决方案
问题描述: <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml&qu ...
- input(file)样式修改及上传文件名显示
实现思路: a标签包裹input元素 设置a标签为上传按钮的样式,相对定位 设置input为透明,绝对定位,覆盖到a上面 效果:看到的按钮是a的样式,点击时实际是点击input元素.样式和功能都具备 ...
随机推荐
- jQuery(四)
get():把jQuery转化成原生js <script> $(function(){ //alert($('#div1').get(0).innerHTML); //jQuery里面也有 ...
- (Alpha)Let's-版本发布说明
我们的Let’s APP发布了! (下载地址在“下载与安装”部分) Alpha版本功能 Alpha版本是我们发布的第一个版本,所以仅实现了活动实体和用户实体之间的基础联系功能. 基本功能 登录和注册 ...
- dip vs di vs ioc
https://stackoverflow.com/questions/6766056/dip-vs-di-vs-ioc https://docs.microsoft.com/en-us/aspnet ...
- NodeJS 学习记录
这里是我学习NodeJs的学习记录 URL:网址解析的好帮手 URL,URI 首先,URI是uniform resource identifier,统一资源标识符,用来唯一的标识一个资源.而URL是u ...
- python之匿名函数lambda
# lambda:匿名函数 # 语法:lambda 参数: 表达式 answer = lambda x: x * 5 print("answer(5): ", answer(5)) ...
- Python连接字符串用join还是+
我们先来看一下用join和+连接字符串的例子 str1 = " ".join(["hello", "world"]) str2 = &quo ...
- [转载]使用VS2015搭建Lua开发环境
参考原文请看: Lua学习笔记1:Windows7下使用VS2015搭建Lua开发环境(一) Lua学习笔记2:Windows7下使用VS2015搭建Lua开发环境(二) 本篇主要分以下几个部分: 一 ...
- Linux LVM逻辑卷配置过程详解(创建,增加,减少,删除,卸载)
Linux LVM逻辑卷配置过程详解 许多Linux使用者安装操作系统时都会遇到这样的困境:如何精确评估和分配各个硬盘分区的容量,如果当初评估不准确,一旦系统分区不够用时可能不得不备份.删除相关数据, ...
- Java 入门进阶
Java 入门进阶 發表於 2015-04-16 http://xielong.me/2015/04/16/%E6%9C%8D%E5%8A%A1%E7%AB%AF%E5%B7%A5%E7%A8%8B% ...
- 【题解】 bzoj2006: [NOI2010]超级钢琴 (ST表+贪心)
题面戳我 Solution 不会,看的题解 Attention 哇痛苦,一直不会打\(ST\)表,我是真的菜啊qwq 预处理 Log[1]=0;two[0]=1; for(int i=2;i<= ...