《一个很不错的CSS改写的大表单文本框和搜索按钮组》要点:
本文介绍了一个很不错的CSS改写的大表单文本框和搜索按钮组,希望对您有用。如果有疑问,可以联系我们。
先看效果图:
开始爬取
CSS部分:/*大搜索框*/
.searchInputBox{
height:62px;
width:810px;
margin:0auto;
border-radius:6px;
background-color:#ffffff;
Box-shadow:05px20px0rgba(51,177,255,0.15);
border:solid1px#33b1ff;
}
.searchInputBox.input{
display:inline-block;
border-radius:6px;
font-size:16px;
width:615px;
height:60px;
border:none;
outline:none;
font-weight:300;
padding-left:20px;
}
.searchInputBox.btn.button{
height:60px;
}
.searchInputBox.btn{
display:inline-block;
width:190px;
font-size:18px;
cursor:pointer;
position:relative;
Box-shadow:0px2px7px0pxrgba(0,0,0.09);
text-align:center;
text-decoration:none;
color:#fff;
line-height:50px;
border-radius:05px5px0;
background-color:#33b1ff;
float:right;
}
.searchInputBox.button{
background-image:linear-gradient(#33b1ff,#33b1ff),linear-gradient(tobottom,#17c5ff,#11c0fa),linear-gradient(#11c4ff,#11c4ff);
}
总结
如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。