HTML代码:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>我的博客</title>
<link rel="stylesheet" type="text/css" href="blog.css"/>
<link rel="stylesheet" type="text/css" href="new.css"/>
</head>
<body>
<div id="first">
<div id="header">
<div id="logo">
<img src="1.jpg">
</div>
<div id="guide">
<ul>
<li><a href="#">首页</a></li>
<li class="nt"></li>
<li><a href="#">浏览</a></li>
<li class="nt"></li>
<li><a href="#">收藏</a></li>
<li class="nt"></li>
<li><a href="#">讨论</a></li>
</ul>
</div>
</div>
<div class="space"></div>
<div id="thing">
<div id="main">
<div id="box1">
<a href="#"><img src="2.jpg"/></a>
<a href="#"><img src="3.jpg"/></a>
<a href="#"><img src="4.jpg"/></a>
<a href="#"><img src="5.jpg"/></a>
<a href="#"><img src="6.jpg"/></a>
</div>
<div id="box2">
<a href="#"><img src="7.jpg"/></a>
</div>
<div id="box3">
<a href="#"><img src="8.jpg"/></a>
</div>
</div>
<div id="side">
</div>
</div>
<div class="space"></div>
<div id="last">
</div>
</div>
</body>
</html>
body{
padding:0px;
margin:0px;
}
#first{
width:960px;
margin:0 auto;
text-align:left;
}
#header{
width:100%;
height:90px; /*tmp*/
background:black;
}
#logo{
margin-top:5px;
margin-left:5px;
float:left;
height:80px;
width:180px;
}
#guide{
margin-top:50px;
margin-right:10px;
float:right;
height:30px;
width:750px;
}
#thing{
width:100%;
height:580px; /*tmp*/
background:url("10.jpg");
}
#main{
float:left;
width:750px;
}
#box1{
float:right;
margin-right:20px;
margin-top:10px;
width:500px;
height:60px;
background:blue;
}
#box2{
float:right;
margin-right:20px;
margin-top:10px;
}
#box3{
float:left;
margin-left:20px;
margin-top:10px;
}
#side{
float:right;
width:200px;
height:580px;
background:url("11.jpg");
font-size:100%;
}
#last{
width:100%;
height:50px; /*tmp*/
background:black;
}
.space{
height:10px;
width:100%;
}
#logo img{
height:80px;
width:180px;
border:0px;
font-size:100%;
margin:0px;
padding:0px;
}
#box1 img{
height:60px;
width:100px;
border:0px;
font-size:100%;
margin:0px;
padding:0px;
float:right;
}
#box2 img{
border:0px;
font-size:100%;
margin:0px;
padding:0px;
float:right;
margin-right:180px;
}
#box3 img{
height:150px;
width:150px;
border:0px;
font-size:100%;
margin:0px;
margin-left:20px;
padding:0px;
float:left;
}
a{
font-size:14px;
text-decoration:none;
color:white;
}
ul{
margin:0px;
padding:0px;
list-style:none;
}
li{
width:80px;
height:30px;
float:left;
text-align:center;
line-height:30px;
}
.nt{
width:1px;
height:14px;
background:white;
margin-top:8px;
}