這段代碼中的input為text的搜索框?yàn)楹卧O(shè)置了寬度不起作用
? ? .search-text{
? ? ?border: 0;
? ? ?float: left;
? ? ?height: 25px;line-height: 25px;
? ? ?outline: none;//
? ? ?width: 350px;
? ? }
設(shè)置了寬度，為何還是那么短
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
<style type="text/css">
? ? body{
? ? ?background: #333;
? ? }
? ? .bg_div{
? ? ?background-image: url("river.jpg");
? ? ?height: 690px;
? ? ?width: 1268px;
? ? ?margin: 0 auto;
? ? ?position: relative;
? ? }
? ? .logo{
? ? ?background-image: url("logo.png");
? ? ?height:53px;
? ? ?width:107px;
? ? ?float: left;
? ??
? ? ?margin: -5px 18px 0 0;
? ? }
? ? .search-form{
? ? ?float: left;
? ? ?background: #fff;
? ? ?padding: 5px;
??
? ? }
? ? .search-text{
? ? ?border: 0;
? ? ?float: left;
? ? ?height: 25px;line-height: 25px;
? ? ?outline: none;//
? ? ?width: 350px;
? ? }
? ? .search-submit{
? ? ?border: 0;
? ? ?background-image: url(search-button.png);
? ? ?height: 29px;
? ? ?width:29px;
? ? ?float: left;
? ? }
? ? .box{
? ? ?position: absolute;
? ? ?top: 200px;
? ? ?left: 400px;
? ? }
? ? .suggest{
? ? ? ? width: 388px;
? ? ? ? background: #fff;
? ? ? ? border: 1px solid #999;
? ? }
? ? .suggest ul{
? ? ? ? list-style: none;
? ? ? ? margin: 0;
? ? ? ? padding: 0;
? ? }
? ? .suggest ul li{
? ? ? ? padding: 5px;
? ? ? font-size: 12px;
? ? ? line-height: 25px;
? ? ? cursor: pointer;
? ? }
? ? .suggest ul li:hover{
? ? ? ? background: #ccc;
? ? ? ? text-decoration: underline;
? ? }
</style>
</head>
<body>
<div>
<div>
<div></div>
<form action="https://cn.bing.con/search" target="_blank" id="search-form" >
<input type="text" name="q" id="search-input" autocomplete="off">
<input type="submit" value="">
</form>
</div>
</div>
<div id="search-suggest" style="display:none">
<ul>
<li>搜索結(jié)果1</li>
<li>搜索結(jié)果2</li>
</ul>
</div>
? ? <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
? ? <script type="text/javascript">
? ? $("#search-input").bind('keyup',function(){
? ? ? ? $("#search-suggest").show().css({
? ? ? ? ? ? left:$('#search-form').offset().left,
? ? ? ? ? ? top:$('#search-form').offset().top+$('#search-form').height(),
? ? ? ? ? ? position:'absolute'
? ? ? ? });
? ? })
? ? </script>
</body>
</html>
2017-03-29
把//去掉