一个看起来比较舒服值得学习的文本框样式

点评：一个看起来比较舒服的文本框样式，关键点在黄色背景那几点，示例代码及截图如下，喜欢的朋友可以参考下！

复制代码代码如下:

.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); 

}