html搜索栏代码

我想要这个效果但是自己做出来文本域和按钮总是高度不一样求助可以把代码写给我看下吗?谢谢... 我想要这个效果 但是自己做出来 文本域和按钮总是高度不一样 求助可以把代码写给我看下吗?谢谢 展开
 我来答
南极潇湘水
2014-10-17 · 本人专业生产bug一百年
南极潇湘水
采纳数:515 获赞数:999

向TA提问 私信TA
展开全部
<style>
*{outline:none;}
.b2{margin:60px 0 5px 0;position:relative;border:0px solid red; }
.b2 .b2_s{margin-left: 10px;outline: 0;border:1px solid #f60;padding:6px;padding-left:15px;color:#999;max-width:70%;min-width:50%;border-radius:20px;}
.b2 .b2_s:onfocus{border:1px solid #f60;outline: 0; }
.b2 .btn{color: #fff;background-color: #428bca;border-color: #357ebd;display: inline-block;padding: 6px 12px;margin-bottom: 0;font-size: 14px;font-weight: normal;text-align: center;white-space: nowrap;vertical-align: middle;cursor: pointer;border: 1px solid transparent;border-radius: 4px;}
.b2 .btn_1{margin-top:-2px;border-bottom-right-radius: 0;border-top-right-radius: 0;margin-right: -6px;height:31px;}
.b2 .btn_2{border-bottom-left-radius: 0;border-top-left-radius: 0;margin-left: -1px;padding:6px 6px;border-bottom-right-radius: 4px;border-top-right-radius: 4px;}
.b2 .b2_b2_u{position: absolute;top:23px;overflow:hidden;display:none;z-index:10;background:#fff;border: 1px solid #ccc;border: 1px solid rgba(0,0,0,0.15);box-shadow: 0 6px 12px rgba(0,0,0,0.175); -webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.175);padding:5px 10px;border-radius: 3px;}
</style>
<div class="b2" id="b2">
<input class="b2_s" type="text" id="h_search" placeholder="请输入书名等信息..">
<button id="b2_btn1" class="btn btn_1">搜索</button>
<button id="b2_btn2" class="btn btn_1 btn_2"><span class="icon-cog2"></span></button>
</div>

我用的,截取

武功帝
推荐于2017-12-15 · TA获得超过521个赞
知道答主
回答量:72
采纳率:0%
帮助的人:44.6万
展开全部
<style>
    .button{border:2px solid #C5C5C5;background:#EEEEEE;margin:0 4px;}
    .search{border:2px solid #C5c5c5;}
</style>
<div class="searchdiv">
                <input type="text" class="search"/>
                <input type="button" value="搜索" class="button" />
                <input type="button" value="高级" class="button" />
            </div>

我用纯html 做的 如果你用了图片按钮 可以试一试给.search和.button 加上vertical-align:middle;这个属性

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友d60b922
2014-10-17 · 超过71用户采纳过TA的回答
知道小有建树答主
回答量:179
采纳率:100%
帮助的人:114万
展开全部
<html>
    <body>
      <div>
<div style="float:left"><input style="height:30px"/></div>
<div style="float:left"><button style="height:30px">搜索</button></div>
<div><button style="height:30px">高级</button></div>
      </div>
    </body>
</html>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
乐橙827
2014-10-17
知道答主
回答量:10
采纳率:0%
帮助的人:7.4万
展开全部
给出你的代码,才能给你看啊
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式