手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >一个看起来比较舒服值得学习的文本框样式
一个看起来比较舒服值得学习的文本框样式
摘要:一个看起来比较舒服的文本框样式,关键点在黄色背景那几点.form-control{display:block;width:100%;heig...

1

一个看起来比较舒服的文本框样式,关键点在黄色背景那几点

.form-control {

display: block;

width: 100%;

height: 34px;

padding: 6px 12px;

font-size: 14px;

line-height: 1.428571429;

color: #555555;

vertical-align: middle;

background-color: #ffffff;

border: 1px solid #cccccc;

border-radius: 4px;

-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);

box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);

-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;

transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;

}

.form-control:focus {

border-color: #66afe9;

outline: 0;

-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);

box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6);

}

【一个看起来比较舒服值得学习的文本框样式】相关文章:

几款不错的按钮样式

中文字体在CSS中的英文表达方式

网页图片延迟加载技术

Width和height—CSS图片的缩放

CSS中文字体对应的英文写法

CSS文字大小单位PX、EM、PT

CSS网页布局中默认字体样式

CSS+DIV实现鼠标经过背景变色

ie6不兼容hover ie6 a hover属性失效解决办法

垂直三栏布局拥有相同高度的方法

精品推荐
分类导航