我班里的電腦分辨率是1600x900 網(wǎng)頁設(shè)計布局正常！圖1我宿舍電腦的分辨率是1920x1080 打開班里做好的網(wǎng)頁，菜單欄移動了位置，搜索欄移動了位置！圖2！這個問題咋處理哈？圖2圖1代碼如下CSSbody?{
background-image:?url(../image/bg1.jpg);
background-repeat:no-repeat;
background-attachment:?fixed;
font-family:?"宋體";
color:?aliceblue;
min-height:750px;
font-size:?12px;
line-height:?1.5em;?
}
.LOGO1
{
float:left;
width:380px;
height:40px;
color:#FFF;
padding:60px;}
*
{
margin:0;
padding:0;
}
.banner
?{
?width:100%;
?height:750px;
?
}
#ybl
{
padding-top:?80px;
padding-left:?60px;
??width:680px;
??height:40px;
??margin:?12px;
???position:fixed;?left:800px;
}??
#ybl?ul
{?
??list-style:none;
??margin-right:100px;
??padding:0;
}
#ybl?ul?li
{?
??float:?left;?
??margin-left:3px;
}??
a
{
color:#FFF;
????text-decoration:?none;
}
a:hover
{
color:?#000;
}
#ybl?ul?li?a
{?
????display:?block;
width:?110px;
height:?30px;
line-height:?px;
text-align:?center;
font-size:?23px;
}??
#ybl?ul?li?ul
{
??border:?0px?solid?#CC0;
??position:absolute;?
??display:none;
}??
#ybl?ul?li?ul?li
{?
float:?none;
}??
#ybl?ul?li?ul?li?a
{?
background:?none;
}??
#ybl?ul?li?ul?li?a:hover
{?
background-color:#333;
color:?#fff;
}??
#ybl?ul?li:hover?ul
{?
display:block
}
#ybl?ul?li.sfhover?{?
display:?block;
????border:?1px?solid?blue;
}HTML<!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=utf-8"?/>
<title>無標(biāo)題文檔</title>
<link?rel="stylesheet"?href="css/body?style.css"?/>
<link?rel="stylesheet"?href="css/sousuo.css"?/>
<link?rel="stylesheet"?href="css/xinbuju.css"?/>
<script?type="text/javascript"?src="js/JS1.js"></script>
<body>
<div?id="sousou">
<form?class="search"?action="">
?<input?type="text"?placeholder="請輸入搜索內(nèi)容."<required>
??<button?type="submit">搜索</button>
</form>
</div>
<div?class="LOGO1"><h1>楊博林創(chuàng)意個人網(wǎng)站</h1><br?/>
<h2>YBL?creative?personal?website</h2>
</div>
<div?id="ybl">
????<ul>
<li><a?href="#">首頁</a></li>??
<li><a?href="#">林工作室</a>?
<ul>
<li><a?href="#">后期制作</a></li>
?<li><a?href="#">系統(tǒng)維護</a></li>
</ul>
</li>
<li><a?href="#">網(wǎng)頁設(shè)計</a>
<ul>
<li><a?href="#">?HTML介紹</a></li>
<li><a?href="#">CSS介紹</a></li>
<li><a?href="#">JS介紹</a></li>
<li><a?href="#">網(wǎng)頁欣賞</a></li>
</ul>
</li>
<li><a?href="#">手機刷機</a>
<ul>
<li><a?href="#">收費刷機</a></li>
<li><a?href="#">資源下載</a></li>
<li><a?href="#">免費教程</a></li>
??</ul>
</li>
<li><a?href="#">關(guān)于我們</a>
<ul>
<li><a?href="#">公眾號</a></li>
<li><a?href="#">聯(lián)系我們</a></li>
</ul></div>
<div?id="xinbuju">
</div>
</body>
</html>CSS2
.search?
{
width:?260px;
height:?40px;
margin:?80px?auto;
????background:?rgba(0,0,0,.2);
border-radius:??5px;
????position:fixed;?left:1500px;
????}???
.search?input
{width:?181px;
padding-top:12px;
color:?#ccc;
font-weight:400;
border:?0;
background:?transparent;
border-radius:?3px?0?0?3px;
}
.search?input:focus
{outline:?0;
background:transparent;}
.search?button?
{
padding-right:;
float:?right;
border:?0;
padding:?0;
height:?40px;
width:?70px;
color:?#fff;
background:?transparent;
background:?rgba(0,0,0,.2);
}???
.search?button:hover
{background:?#fff;
color:#444;}
#sousou
{
padding-right:60px;
}
??#xinbuju
?{
?height:200px;
?width:570px;
?background-color:?#FFF;
?color:?#000;
?position:fixed;
?top:350px;
?left:850px;
?}
網(wǎng)頁設(shè)計尺寸問題！請大神幫幫我吧！謝謝啦！
qq_那就好_2
2017-06-14 21:08:58
