博客静态网页代码：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<!--引入css文件用link标签-->
<link href="blog.css" type="text/css" rel="stylesheet" />
<!--<script type="text/javascript" src=""></script>-->
</head>
<body>
<div id="box">
<div id="banner">
<img src="images/bg.jpg" alt="我的图片不见了" />
</div>
<div id="menu">
我是菜单
</div>
<div id="main">
<!--左边区域-->
<div id="left">
左边区域
</div>
<div id="right">
右边区域
</div>
</div>
<div id="footer">
footer
</div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
#box{
background-color:#F00;
width:1024px;/* 设置id是box的div，高度为1014px */
height:1300px;
/*margin:0 auto;*/
margin:0 auto 0 auto;/*上 右 下 左*/
}
/放图片，设置高度和图片一样高/
#banner{
background-color:#66F;
height:209px;
}
<!– 导航菜单区域的高、宽、背景色 -->
#menu{
<!– 吸管工具，十六进制--> background-color:#C3F; height:50px;
}
<!– 中间一大块主体区域的高、宽、背景色 -->
#main{ background-color:#6F0; height:1000px; } <!– 中间区域左边部分的的高、宽、背景色 -->
#left{
background-color:#33C;
height:1000px;
width:250px;
float:left;/*可以使div横向排排坐*/
}
#right{
background-color:#F3F;
height:1000px;
width:774px;
float:right;/*可以使div横向排排坐*/
}
#footer{
background-color:#F63;
height:80px;
}
4229
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
