我写了一个index1.html的文件，直接双击文件打开是正常的，但是如果在浏览器输入localhost/index1.html的话，网页能正常打开，但是布局就会改变，网页中的表格移到外面了。IIS中的路径也是对的。刚学css，不知道是不是要加什么代码。下面是html文件的代码。
<!DOCTYPE html>
<html>
<head>
<title>首页</title>
<style type="text/css">
body
{
margin:0px;
background-image:url(images/6.jpg);
}
/* 定义容器container，把所有div都放到container中 */
#container
{
position:relative;
width:1200px;
height:2000px;
background-color:white;
margin:0 auto;
}
/* 左右花边 */
#leftdec
{
position:absolute;
width:35px;
height:2000px;
background-image:url(images/9.jpg);
background-color:white;
background-position:left;
background-repeat:repeat-y;
margin-left:0px;
}
#rightdec
{
position:absolute;
width:35px;
height:2000px;
background-image:url(images/10.jpg);
background-color:white;
background-position:right;
background-repeat:repeat-y;
margin-left:1165px;
}
/* 主界面，将所有内容都放在main中 */
#main
{
position:absolute;
width:1130px;
height:2000px;
background-color:white;
margin-left:35px;
}
/* 页头装饰 */
#head
{
position:absolute;
width:1130px;
height:100px;
background-image:url(images/7.jpg);
top:0px;
}
/* 页脚装饰 */
#foot
{
position:absolute;
width:1130px;
height:100px;
background-image:url(images/8.jpg);
bottom:0px;
}
/* 四个女孩图片 */
#pic1
{
width:600px;
height:400px;
margin-top:200px;
margin-left:265px;
}
/* 带文字图片 */
#pic2
{
width:420px;
height:200px;
margin-top:100px;
margin-left:355px;
}
/* 圆形小人图片 */
#baby1
{
width:155px;
height:155px;
margin-top:100px;
margin-left:180px;
float:left;
}
#baby2
{
width:155px;
height:155px;
margin-top:100px;
margin-left:50px;
float:left;
}
#baby3
{
width:155px;
height:155px;
margin-top:100px;
margin-left:50px;
float:left;
}
#baby4
{
width:155px;
height:155px;
margin-top:100px;
margin-left:50px;
float:left;
}
/* 小人下方文字链接 */
#word
{
width:820px;
height:100px;
margin-top:0px;
margin-left:155px;
font-family:"华文行楷";
font-size:x-large;
color:black;
}
</style>
</head>
<body>
<div id="container">
<div id="leftdec"></div>
<div id="main">
<div id="head"></div>
<div id="pic1"><img src="images/5.jpg"/></div>
<div id="pic2"><img src="images/11.jpg"/></div>
<div id="baby1"><img src="images/1.jpg"/></div>
<div id="baby2"><img src="images/2.jpg"/></div>
<div id="baby3"><img src="images/3.jpg"/></div>
<div id="baby4"><img src="images/4.jpg"/></div>
<div id="word">
<table width="820px" height="90px">
<tr align="center" valign="center">
<td width="205px" height="20px">基本资料</td>
<td width="205px" height="20px">技能爱好</td>
<td width="205px" height="20px">学习经历</td>
<td width="205px" height="20px">个人评价</td>
</tr>
</table>
</div>
<div id="foot"></div>
</div><!-- end #main -->
<div id="rightdec"></div>
</div><!-- end #container -->
</body>
</html>
正常显示（直接双击显示）
错误显示，红色箭头位置（用localhost打开）
