css 美化input输入框-美化按钮

css 美化input输入框-美化按钮

我们会看到很多网站的文本输入框都非常漂亮哦，如taobao等，下面我们来看一下我们用css美化输入框的代码吧。

.SearchBar {
 font-size:12px; letter-spacing:2px;
 border-bottom:1px solid #dddddd;
 padding:5px 0px 3px 0px;
 margin:4px 0px 4px 0px;
 text-align:center;height:24px;
 FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=’#f5f5f5′, endColorStr=’#eeeeee’, gradientType=’0′);
}
.SearchBar input.textfield{
 border-top:1px solid #dddddd;border-left:1px solid #dddddd;
 border-right:1px solid #ffffff;border-bottom:1px solid #ffffff;
 BACKGROUND-COLOR: #f5f5f5;line-height:18px;
 width:240px;HEIGHT: 22px;
}
.SearchBar span.button{
 BORDER: 1px outset #f0f0f0;
 BACKGROUND-COLOR: #fafafa;
 width:50px;HEIGHT: 20px;
 padding:3px 3px 2px 3px;
 cursor:hand;
}