谁能帮我用DIV+CSS布局下小米官网的搜索框。。。谢谢了!

 我来答
大孩子玩具plus
推荐于2016-10-07 · 超过56用户采纳过TA的回答
知道小有建树答主
回答量:143
采纳率:0%
帮助的人:117万
展开全部

以下是代码 ,仅供参考

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>demo</title>
<style type="text/css">
* {outline: none;}
.search {position: relative;display: inline-block;}
.txt {display: block;width: 364px;height: 32px;line-height: 32px;text-indent: 6px;border: 3px solid #dd4250;background: #fff;margin-bottom: 6px;color: #ccd1d9;-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;}
.btn {position: absolute;background: none;right: 2px;top: 0px;z-index: 2;display: block;width: 50px;height: 40px;cursor: pointer;border: none;}
.ico {width: 40px;height: 34px;position: absolute;top: 3px;_top: 5px;z-index: 1;display: block;cursor: pointer;border: none;right: 3px;}
.ico em {background-image: url("http://p.www.xiaomi.com/zt/2013/icon-common-newyear.png");z-index: 1;display: block;cursor: pointer;border: none;width: 17px;height: 18px;background-position: -223px -51px;margin: 8px 11px;}
</style>
</head>

<body>
<div class="search">
   <form id="user_search" action="/search" method='get' onsubmit="">
      <input type="text" id="keyword" name="keyword" class="txt"  autocomplete="off" value="搜索" />
      <input type="submit" class="btn" value="" />
  <span class="ico" id="scico"><em></em></span>
   </form>
</div>
</body>
</html>

效果图如下:

0小慕00
2014-02-25 · 超过18用户采纳过TA的回答
知道答主
回答量:130
采纳率:0%
帮助的人:46.5万
展开全部
楼上的写的很详细嘛
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

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

类别

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

说明

0/200

提交
取消

辅 助

模 式