实战之仿博客网页

　　代码如下：

　　<!DOCTYPEhtml>

　　<html>

　　<head>

　　<metacharset="utf-8">

　　<title>myBlog</title>

　　<style>

　　body{

　　margin:0;

　　padding:0;

　　}

　　#container{

　　width:1349px;

　　height:1500px;

　　background-color:#eee;

　　}

　　#header{

　　background-color:white;

　　height:50px;

　　width:1349px;

　　}

　　#header.titleli{

　　height:50px;

　　line-height:50px;

　　font-size:15px;

　　margin-left:20px;

　　margin-right:10px;

　　list-style-type:none;

　　float:left;

　　}

　　.titlelia:link{

　　color:black;

　　text-decoration:none;

　　}

　　.titlelia:hover{

　　color:red;

　　}

　　#header.subtitleli{

　　line-height:50px;

　　float:left;

　　list-style-type:none;

　　font-size:15px;

　　margin-right:10px;

　　color:black;

　　}

　　.subtitlelia:link{

　　color:black;

　　text-decoration:none;

　　}

　　.subtitlelia:hover{

　　color:red;

　　}

　　#main{

　　width:1349px;

　　height:1500px;

　　background-image:url(./images/bkg.jpg);

　　}

　　#mainh{

　　margin:50px900px50px80px;

　　font-size:40px;

　　font-weight:700px;

　　float:left;

　　}

　　#main.manali{

　　float:left;

　　margin-right:20px;

　　margin-top:40px;

　　list-style-type:none;

　　font-size:15px;

　　color:white;

　　}

　　.manalia{

　　border:1pxsolidwhite;

　　padding:2px;

　　color:white;

　　text-decoration:none;

　　}

　　.manaa:hover{

　　background:red;

　　color:white;

　　}

　　#lside{

　　width:800px;

　　height:700px;

　　background:white;

　　margin:0px50px50px80px;

　　padding:5px;

　　float:left;

　　}

　　#rside{

　　width:300px;

　　height:1000px;

　　background:white;

　　float:left;

　　}

　　#stateh{

　　margin:20px400px20px15px;

　　color:#999;

　　font-size:18px;

　　border:1pxsolidgray;

　　padding:2px;

　　font-family:'PingFangSC','MicrosoftYaHei',SimHei,Arial,SimSun;

　　}

　　#stateimg{

　　margin:20px20px10px15px;

　　}

　　#artitlrtitleh{

　　font-size:20px;

　　font-weight:700px;

　　margin:10px200px10px15px;

　　float:left;

　　clear:both;

　　}

　　#contentp{

　　font-size:10px;

　　margin:5px15px;

　　clear:both;

　　color:#999;

　　}

　　#timeh{

　　margin:3px10px5px15px;

　　font-size:15px;

　　float:left;

　　color:#999;

　　}

　　#time.oth{

　　margin:3px10px5px15px;

　　font-size:15px;

　　float:left;

　　color:#999;

　　}

　　#headimg{

　　margin:15px;

　　}

　　#headp{

　　float:left;

　　font-size:20px;

　　margin:30px10px;

　　font-weight:700px;

　　color:#999;

　　font-weight:600px;

　　}

　　#four.yuan{

　　font-size:16px;

　　font-weight:700px;

　　margin:5px10px10px40px;

　　color:gray;

　　float:left;

　　}

　　#four.num1{

　　font-size:14px;

　　font-weight:700px;

　　margin:5px6px20px51px;

　　color:#999;

　　}

　　#four.num2{

　　font-size:14px;

　　font-weight:700px;

　　margin:5px7px20px50px;

　　color:#999;

　　}

　　#four.num3{

　　font-size:14px;

　　font-weight:700px;

　　margin:5px7px20px46px;

　　color:#999;

　　}

　　#four.num4{

　　font-size:14px;

　　font-weight:700px;

　　margin:5px7px20px29px;

　　color:#999;

　　}

　　#intro{

　　height:260px;

　　width:300px;

　　margin-top:10px;

　　}

　　#intro.ff{

　　font-size:10px;

　　margin:5px20px;

　　clear:both;

　　}

　　#fenleih{

　　font-size:15px;

　　font-weight:700px;

　　float:left;

　　margin:10px20px;

　　font-weight:700px;

　　}

　　#fenleip.ti1{

　　float:left;

　　clear:left;

　　font-size:10px;

　　margin:5px20px;

　　color:gray;

　　text-decoration:none;

　　}

　　#fenleip.ti1:hover{

　　color:red;

　　}

　　#fenlei.tii1{

　　float:right;

　　clear:right;

　　font-size:8px;

　　margin:5px20px;

　　color:#bbb;

　　}

　　#cundangh{

　　font-size:15px;

　　font-weight:700px;

　　float:left;

　　clear:left;

　　margin:20px20px;

　　}

　　#cundangp.ti1{

　　float:left;

　　clear:left;

　　font-size:10px;

　　margin:5px20px;

　　color:gray;

　　text-decoration:none;

　　}

　　#cundangp.ti1:hover{

　　color:red;

　　}

　　#cundang.tii1{

　　float:right;

　　clear:right;

　　font-size:8px;

　　margin:5px20px;

　　color:#bbb;

　　}

　　#paimingh{

　　font-size:15px;

　　font-weight:700px;

　　float:left;

　　clear:left;

　　margin:20px20px;

　　font-weight:700px;

　　}

　　#pm.tiname{

　　float:left;

　　clear:left;

　　font-size:15px;

　　margin:5px20px;

　　color:gray;

　　text-decoration:none;

　　}

　　#pm.tiname:hover{

　　color:red;

　　}

　　#pm.tinum{

　　float:left;

　　clear:left;

　　font-size:8px;

　　margin:3px20px;

　　color:#bbb;

　　}

　　#callush{

　　font-size:15px;

　　font-weight:700px;

　　float:left;

　　clear:left;

　　margin:20px20px;

　　font-weight:700px;

　　}

　　#callus.us{

　　font-size:10px;

　　margin:5px2px5px20px;

　　float:left;

　　clear:left;

　　}

　　#callus.weibo{

　　font-size:10px;

　　margin:5px5px;

　　padding-right:80px;

　　float:right;

　　clear:right;

　　}

　　#callus.us1{

　　font-size:10px;

　　margin:5px20px;

　　float:left;

　　clear:left;

　　}

　　#callus.oo1{

　　margin:40px80px10px80px;

　　font-size:10px;

　　float:left;

　　clear:left;

　　}

　　#callus.oo2{

　　margin:10px80px10px80px;

　　font-size:10px;

　　float:left;

　　clear:left;

　　}

　　</style>

　　</head>

　　<body>

　　<divid="container">

　　<divid="header">

　　<divid="firstpic">

　　<imgahref=""src="./images/csdn.jpg"alt=""width="80"height="50"style="float:left"></a>

　　</div>

　　<divid="menu">

　　<ulclass="title">

　　<li><ahref="#">GitChat</a></li>

　　<li><ahref="#"style="margin-right:150px">ITeye</a></li>

　　</ul>

　　</div>

　　<divid="secondpic">

　　<imgid="search"src="./images/search.jpg"alt=""height="40"width="200"style="float:left">

　　</div>

　　<divid="other">

　　<ulclass="subtitle">

　　<li><ahref="#"style="margin-left:23px">发Chat</a></li>

　　</ul>

　　</div>

　　<divid="thirdpic">

　　<imgahref=""src="./images/c.gif"alt=""width="50"height="50"style="float:left"></a>

　　</div>

　　<divid="main">

　　<ulclass="mana">

　　<li><ahref="">修改个人资料</a></li>

　　</ul>

　　<divid="lside">

　　<divid="state">

　　<divid="fourthpic">

　　<imgsrc="./images/search.jpg"alt="">

　　</div>

　　<divid="artitlrtitle">

　　<h>listview实现列表</h>

　　</div>

　　<divid="content">

　　<p>listview实现一个列表。listview实现一个列表。listview实现一个列表。listview实现一个列表。listview实现一个列表。listview实现一个列表。listview实现一个列表。listview实现一个列表.listview实现一个列表.listview实现一个列表.</p>

　　</div>

　　<divid="time">

　　<pclass="oth">2018-01-0100:00:00</p>

　　<pclass="oth">阅读量：1000</p>

　　<pclass="oth">评论：2</p>

　　</div>

　　<divid="artitlrtitle">

　　<h>listview实现列表</h>

　　</div>

　　<divid="content">

　　</div>

　　<divid="time">

　　<pclass="oth">2018-01-0100:00:00</p>

　　<pclass="oth">阅读量：1000</p>

　　<pclass="oth">评论：2</p>

　　</div>

　　<divid="artitlrtitle">

　　<h>listview实现列表</h>

　　</div>

　　<divid="content">

　　</div>

　　<divid="time">

　　<pclass="oth">2018-01-0100:00:00</p>

　　<pclass="oth">阅读量：1000</p>

　　<pclass="oth">评论：2</p>

　　</div>

　　<divid="artitlrtitle">

　　<h>listview实现列表</h>

　　</div>

　　<divid="content">

　　</div>

　　<divid="time">

　　<pclass="oth">2018-01-0100:00:00</p>

　　<pclass="oth">阅读量：1000</p>

　　<pclass="oth">评论：2</p>

　　</div>

　　<divid="artitlrtitle">

　　<h>listview实现列表</h>

　　</div>

　　<divid="content">

　　</div>

　　<divid="time">

　　<pclass="oth">2018-01-0100:00:00</p>

　　<pclass="oth">阅读量：1000</p>

　　<pclass="oth">评论：2</p>

　　</div>

　　<divid="rside">

　　<divid="head">

　　<imgahref=""src="./images/c.gif"alt=""width="50"height="50"style="float:left"></a>

　　<divid="four">

　　<pclass="yuan"style="word-spacing:22px;text-indent:6px;">原创粉丝喜欢码云</p>

　　<pclass="num1">8</p>

　　<pclass="num2">8</p>

　　<pclass="num3">8</p>

　　<pclass="num4">未开通</p>

　　</div>

　　<divid="intro">

　　<pclass="ff">访问量：1000</p>

　　<pclass="ff">等级：2</p>

　　<pclass="ff">排名：10000</p>

　　<pclass="ff">勋章：恒</p>

　　</div>

　　<divid="fenlei">

　　<p><aclass="ti1"href="#">Android</a></p>

　　<pclass="tii1">8篇</p>

　　<pclass="tii1">8篇</p>

　　<pclass="tii1">8篇</p>

　　</div>

　　<divid="cundang">

　　<pclass="tii1">2篇</p>

　　<pclass="tii1">2篇</p>

　　<pclass="tii1">6篇</p>

　　</div>

　　<divid="paiming">

　　<divid="pm">

　　<p><aclass="tiname"href="#">css链接</a></p>

　　<pclass="tinum">阅读量：200</p>

　　</div>

　　<divid="pm">

　　<p><aclass="tiname"href="#">css链接</a></p>

　　<pclass="tinum">阅读量：200</p>

　　</div>

　　<divid="pm">

　　<p><aclass="tiname"href="#">css链接</a></p>

　　<pclass="tinum">阅读量：200</p>

　　</div>

　　<divid="callus">

　　<pclass="us">网站客服</p>

　　<pclass="weibo">微博客服</p>

　　<pclass="us1">www.php.cn</p>

　　<pclass="us1">400-100-200</p>

　　<pclass="oo1">京ICP证00000000号</p>

　　<pclass="oo2">关于|招聘|广告服务</p>

　　</div>

　　</body>

　　</html>

本文转载自中文网

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h55031.shtml