UC知道窗口一变小怎么css的效果就变了？
来源：百度知道 编辑：UC知道 时间：2024/05/29 08:00:53
代码如下，有点长，不好意思。
<html>
<head>
<title>基本好了</title>
<style type="text/css">
body{
background-image:url(bg.jpg);
}
#header{
position:relative;
width:50%;
left:19%;
padding-top:4%;
}
#sitenav ul{
margin:0;
}
#sitenav{
position:relative;
width:62%;
height:57%;
left:19%;
background-image:url(first_12.png);background-repeat:repeat-x;
}
#sitenav ul li{
float:left;
list-style-type:none;
display:block;
text-align:center;
margin-left:50px;
margin-right:40px;
padding-top:24px;
width:150px;
}
#sitenav ul li a{
color:#2A2A2A;
display:block;
padding-top:18px;
text-decoration:none;
font-family:"宋体"
<html>
<head>
<title>基本好了</title>
<style type="text/css">
body{
background-image:url(bg.jpg);
}
#header{
position:relative;
width:50%;
left:19%;
padding-top:4%;
}
#sitenav ul{
margin:0;
}
#sitenav{
position:relative;
width:62%;
height:57%;
left:19%;
background-image:url(first_12.png);background-repeat:repeat-x;
}
#sitenav ul li{
float:left;
list-style-type:none;
display:block;
text-align:center;
margin-left:50px;
margin-right:40px;
padding-top:24px;
width:150px;
}
#sitenav ul li a{
color:#2A2A2A;
display:block;
padding-top:18px;
text-decoration:none;
font-family:"宋体"
费了老大劲看了一遍。 没有仔细的给你分析 我的结论如下：
你是部分用的百分比来定值的，可以自适应伸缩，但是还有部分是PX固定值。我建议你要么就全部用PX 要么就全部用百分比，尽量不要混用。混用的结果就是容易错位。
用百分比的时候 有些地方的值需要用em来定义。 还有 position relative不要用的太多。能不定位就不定位。
把你要显示的元素放到table里，这样相对位置就比较好控制了
单纯 div不好操作