html 简易个人主页制作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
body{ margin:0px;
padding:0px;
background-image:url(bg9.gif);
text-align:center;
font-size:12px;}
#big{ margin:0px auto;
width:600px;
text-align:left;
position:relative;
}
#banner{ 
width:600px;
height:133px;
background-image:url(banner3.jpg);
background-repeat:no-repeat;
}
#dh{ background-color: #09F;;
margin-top:1px;
margin-bottom:1px;
overflow:hidden;

}
#dh ul{ padding:0px;
margin:0px;
list-style-type:none;
text-align:center;
font-size:12px;
}
#dh li{ width:100px; float:left;}
#dh li a{ width:100px;
height:30px;
display:block;
line-height:30px;
text-decoration:none;
color:#000;}
#dh li a:hover{ color:blue;
background-color:#FFF;
text-decoration:underline;}
#left{ width:150px;
height:523px;
float:left;
background-color:#d2e7ff;
text-align:center;}
#left p{padding:0px 0px 10px 0px; margin:0px 11px; }
img{
	border:1px solid #00406c;
	margin:20px 17px 5px;
}
#right{ width:450px;
height:523px;
float:left;
background-image:url(self.jpg);
background-repeat:no-repeat;
background-size:450px 523px;}
#right h4{ margin:15px;
color:#0078aa;
text-decoration:underline;}
#right p{ margin:15px;
line-height:17px;}


</style>
</head>

<body>
<div id="big">
  <div id="banner">
  </div>
 <div id="dh">
   <ul>
     <li><a href="#">首页</a></li>
     <li><a href="#">心情日记</a></li>
     <li><a href="#">一起走到</a></li>
     <li><a href="#">从明天起</a></li>
     <li><a href="#">纸飞机</a></li>
     <li><a href="#">下一站</a></li>
   </ul>
 </div>
<div id="zhuti">
  <div id="left">
  
   <p><img src="selfpic.jpg" >
	</br>我的日记本</p>
			<p class="a">他们彼此深信，是瞬间迸发的热情让他们相遇。这样的确定是美丽的， 但变幻无常更为美丽。</p>
  
  <p><img src="selfpic2.jpg">
			</br>心情轨迹</p>
			<p class="a">董事长的一切都让人既羡慕又忌妒，但更让人受不了的是，有一天，上苍忽然赐给他一个神奇的礼物………</p>
  </div>
  
  <div id="right">
  <h4>介绍</h4>
			<p>我努力的抓紧世界，最后却仍被世界淘汰，如果一开始就松手，我会不那么伤心吗？你说，亲爱的孩子，世事难料，随它去吧！</p>
			<h4>照相本子</h4>
			<p>关于童年，你记住了什么？ <br>
			两岁时，我拥有一只巨大的粉红猪，它总在我嚎啕大哭时逗我笑。<br>
			三岁时，我骑着小木马一路摇到外婆家，它不喝水也不吃草。<br>
			四岁时，我离家出走，在公车上睡着了，最后是太空超人送我回家。<br>
			我真的没骗你，我通通都记得，还有照片为证。
			</p>
			<h4>地下铁</h4>
			<p>天使在地下铁的入口，<br>
			和我说再见的那一年，<br>
			我渐渐看不见了。<br>
			十五岁生日的那年秋天早晨，<br>
			窗外下着毛毛雨，<br>
			我喂好我的猫。<br>
			六点零五分，<br>
			我走进地下铁。</p>
			<h4>向左走向右走</h4>
			<p>They're both convinced<br>
			that a sudden passion joined them.<br>
			Such certainth is beautiful,<br>
			but uncertainty is more beautiful still.</p>
			<br>
  </div>
  </div>
</div>
</body>
</html>
html 简易个人主页制作

猜你喜欢
