前端—搜索框
前端—搜索框
一半一伴 发表于1年前
前端—搜索框
  • 发表于 1年前
  • 阅读 2
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 技术升级10大核心产品年终让利>>>   

1、搜索框

CSS:
/*reset*/
div,input,button{margin:0;padding:0;}
input{outline: none;}
input[type="text"]{padding-left:5px;}
input::-ms-clear{display:none;}
button{cursor: pointer;}
/*样式*/
.search-txt{width:300px;height: 30px;line-height:30px;vertical-align: middle;border:1px solid #d5d5d5;}
.search-btn{padding:0 10px;height:32px;vertical-align: middle;background:#19aa8d;border:1px solid #d5d5d5;
            color:#fff;font-size:14px;font-family: "Microsoft YaHei"}

2、搜索框

CSS:
/*reset*/
div,input,button{margin:0;padding:0;}
input{outline: none;}
input[type="text"]{padding-left:5px;}
input::-ms-clear{display:none;}
button{cursor: pointer;}
/*样式*/
.search-txt{width:300px;height: 30px;line-height:30px;vertical-align: middle;border:1px solid #d5d5d5;padding-right:5px;}
.search-btn{padding:0 10px;width:35px;height:32px;vertical-align: middle;border:1px solid lightblue;
            color:#fff;font-size:0px;font-family: "Microsoft YaHei";margin-left:-8px;background:lightblue url(search.png) no-repeat center;}

3、搜索框

CSS:
/*reset*/
div,input,button{margin:0;padding:0;}
input{outline: none;}
input[type="text"]{padding-left:5px;}
input::-ms-clear{display:none;}
button{cursor: pointer;}
/*样式*/
.search-txt{width:300px;height: 30px;line-height:30px;vertical-align: middle;border:1px solid #d5d5d5;border-right:0;padding-right:5px;}
.search-btn{padding:0 10px;width:35px;height:32px;vertical-align: middle;border:1px solid #d5d5d5;border-left:none;
            color:#fff;font-size:0px;font-family: "Microsoft YaHei";margin-left:-8px;background:url(search.png) no-repeat center;}

 

共有 人打赏支持
粉丝 3
博文 5
码字总数 3514
×
一半一伴
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: