label--input
.form-group {
margin-bottom: 15px;
position: relative;
}
.control-label{
float: left;
width: 15%;
text-align: right;
padding-right: 20px;
padding-top: 7px;
}
.form-control{
float: left;
width: 50%;
}
.form-control input{
display: block;
width: 100%;
height: 34px;
padding: 0 12px;
font-size: 14px;
line-height: 1.428571429;
color: #555555;
vertical-align: middle;
outline: none;
background-color: #ffffff;
background-image: none;
border: 1px solid #cccccc;
border-radius: 4px;
}
.s-r{
height: 34px;
line-height: 34px;
position: absolute;
top: 25px;
right: 0;
z-index: 2;
display: block;
}
.clearfix:before,.clearfix:after{
content: "";
display: table;
}
.clearfix:after{
clear: both;
}
.clearfix{
zoom:1;
}
<div class="form-group clearfix">
<label for="inputPassword3" class="control-label">Password</label>
<div class="form-control">
<input type="text" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group clearfix">
<label for="inputPassword2" class="control-label">Password</label>
<div class="form-control">
<input type="text" id="inputPassword2" placeholder="Password">
</div>
</div>
<div class="form-group clearfix">
<label for="inputPassword1" class="control-label">Password</label>
<div class="form-control">
<input type="text" id="inputPassword1" placeholder="Password">
</div>
<span class="s-r">元</span>
</div>
<label>
<input type="checkbox" />
记住用户名
</label>
label--input的更多相关文章
- $("label + input") 匹配所有紧接在 prev 元素后的 next 元素
描述: 匹配所有跟在 label 后面的 input 元素 HTML 代码: <form> <label>Name:</label> <input name= ...
- label+input实现开关切换效果
Document 主要使用label+input来实现改变left的值,下面是核心代码,意思就是选中的input的兄弟节点.box下的.switch-btn元素的left会变成0px(原来是-37px ...
- jQuery改变label/input的值,改变class,改变img的src
jQuery改变label/input的值.改变class,改变img的src jQuery改变label的值: $('#aID').text("New Value"); jQue ...
- html5 填表 表单 form label input button legend fieldset
<form>本身没有什么意义, 但是某些依赖form的标签元素一旦没有了form就不能生效. 所以form是提供一个定义环境给form的插件元素去生效的. 1.method 属性pos ...
- label+input实现按钮开关切换效果
label+input实现按钮开关切换效果 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- 纯 CSS 利用 label + input 实现选项卡
clip 属性 用于剪裁绝对定位元素. .class { position:absolute; clip:rect(0px,60px,200px,0px); } scroll-behavior: sm ...
- label和input里面文字不对齐的解决方法!
测试了集中方法,发现不行.只能用专署标签解决这个问题. <fieldset> <legend>神光咨询后台管理登录</legend> <br /& ...
- label、input、table标签
<label>标签 <form> <label for="male">Male</label> <input type=&qu ...
- HTML label标签的for属性--input标签的accesskey属性
本次示例是在firefox演示(如果其他浏览器对accesskey操作不成功的,请参考文章最后各浏览器下的快捷键)label的for属性是和input的id绑定,当我们点击input前面的文本标识会自 ...
- label与input间距的小问题
先码后文 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
随机推荐
- 【BZOJ3774】最优选择 最小割
[BZOJ3774]最优选择 Description 小N手上有一个N*M的方格图,控制某一个点要付出Aij的代价,然后某个点如果被控制了,或者他周围的所有点(上下左右)都被控制了,那么他就算是被选择 ...
- 【CF819D】Mister B and Astronomers EXGCD
[CF819D]Mister B and Astronomers 题意:小鼠Jack想当太空人(哦不,太空鼠)!为此,它在夜晚带领一堆小朋友一起来到户外看星星.一共有 $n$ 只小鼠,这些小鼠围成一 ...
- jenkins使用Publish Over SSH中遇到的问题
在jenkins中想使用publish over ssh来在构建后发送XML或PNG文件至服务器,以便做其它的操作,安装完publish over ssh后,填加构建,发现在构建失败时,不传送文件,老 ...
- Android Popup Window 居于控件上方突出显示
public class TestPopupWindowActivity extends PopupWindow { Activity context; public TestPopupWindowA ...
- Xcode - LLDB调试技巧
LLDB是Xcode默认的调试器,它与LLVM编译器一起,带给我们更丰富的流程控制和数据检测的调试功能.平时用Xcode运行程序,实际走的都是LLDB.熟练使用LLDB,可以让你debug事半功倍. ...
- R排序sort、order、rank、arrange
Ø sort sort(x, decreasing = FALSE, ...) ## Default S3 method: sort(x, decreasing = FALSE, na.last = ...
- ABP之应用服务(1)
在一个理想的层级项目中,展现层是不能直接访问领域对象的,那么展现层如何获取到自己需要的数据呢?也就是今天的主角-Application层,它的职责就是为展现层服务,它通过仓储获取到相应的数据,然后将数 ...
- POJ3268 Silver Cow Party【最短路】
One cow from each of N farms (1 ≤ N ≤ 1000) conveniently numbered 1..N is going to attend the big co ...
- 1.5神经网络可视化显示(matplotlib)
神经网络训练+可视化显示 #添加隐层的神经网络结构+可视化显示 import tensorflow as tf def add_layer(inputs,in_size,out_size,activa ...
- B-tree indexes
High Performance MySQL, Third Edition by Baron Schwartz, Peter Zaitsev, and Vadim Tkachenko http://d ...