<分区>
我开始接触创建网站，但有些事情我不明白。例如:
我创建了一个 wrapperdiv。它里面有三个主要部分:页眉、内容和页脚。我给 wrapperdiv 一个固定大小(1280px x 1024px)并将内容 div 设置为该大小的 2/3。其余为 1/3。 现在，每当我想在我的 subs div 中填充一些东西时，它就会与包装 div 重叠，我不知道如何修复它。
我决定在 wrapperdiv 中使用百分比，以便在有人查看网站时缩放等操作流畅。
对此有什么想法吗？我怎样才能做得更好？
谢谢!
代码:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<div id="pagewrapper">
<div id="header">
</div>
<div id="content">
</div>
<div id="footer">
</div>
</div>
</body>
</html>
CSS:
@font-face {
font-family: "Bickley";
src: url(fonts/Bickley%20Script.ttf);
}
@font-face {
font-family: "American";
src: url(fonts/American%20Classic%20Bold.ttf);
}
body {
font-size: 1em;
font-family: sans-serif;
color: #c6c6c6;
background-image: url("images/bodybackground.jpg");
}
a:link {
text-decoration: none;
color: #c6c6c6;
}
a:visited {
color: #c6c6c6;
}
a:hover {
color: #c6c6c6;
}
a:active {
color: #c6c6c6;
}
#pagewrapper {
width: 1280px;
height: 1024px;
margin: 0 auto;
padding: 1%;
background-color: red;
}
#header {
width: 100%;
height: 16.75%;
background-color: blue;
}
#content {
width: 100%;
height: 66.5%;
background-color: yellow;
}
#footer {
width: 100%;
height: 16.75%;
background-color: green;
}