【头像表格】论坛头像表格,男女两套模板
本帖最后由 QQmcc-亂馬 于 2016-12-26 14:35 编辑 <br /><br />使用请注明表格|没去
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
.all{width: 830px;margin: auto;}
.left_a{float: left;width: 250px;text-align: center;}
.left_a img{width:250px;height:808px;}
.right_a{float: left;width: 575px;margin-left: 5px;text-align: center;background: black;}
.right_a img{width:150px;height:150px;margin-left: 5px;margin-top: 5px;border: solid 2px white;}
.clear{clear: both;}
.right img{margin-top: 5px;margin-left: 5px;}
.foot_z{margin-top:20px;height: 250px;font-size: 18px;width: 250px;float: left;text-align: center;background: black;}
.foot_z img{width:150px;height:150px;}
.foot_z a{text-decoration: none;}
.foot_z a:hover{color: firebrick;}
.foot_x{float: left;width: 575px;margin-left: 5px;margin-top: 20px;height: 250px;background: black;font-size:15px;font-family:"微软雅黑";}
.foot_x li{margin-left: 20px;}
.foot_x a{text-decoration: none;color:white;margin-left: 15px;}
.foot_x a:hover{color: red;}
.clear_a{clear: both;}
.foot_y{margin-top: 20px;width: 830px;height: 200px;background: black;text-align: center;}
.foot_y img{margin-left: 5px;width: 150px;height: 150px;border: solid 2px white;}
.foot_g{margin-top: 20px;width: 830px;height: 50px;background: black;text-align: center;font-weight: bold;line-height: 50px;color: white;font-size:20px}
</style>
</head>
<body>
<div class="all">
<div class="left_a">
http://attachment.qqmcc.net/attachment/album/201612/20/104250srt5ztj565rm7hir.jpg
</div>
<div class="right_a">
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
</div>
<div class="clear"></div>
<div class="foot_z">
<br/>
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<br/><a href="http://www.qqmcc.net/">作者</a><hr />
</div>
<div class="foot_x">
<br />
<a href="http://www.qqmcc.net/forum.php/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
<a href="http://www.qqmcc.net/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
<a href="http://www.qqmcc.net/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
</div>
<div class="clear_a"></div>
<div class="foot_y">
<br/>
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
</div>
<div class="foot_g">
跌入尘埃
</div>
</div>
</body>
</html>
本帖最后由 没去 于 2016-12-26 14:15 编辑
下面是教程
**** Hidden Message *****
本帖最后由 没去 于 2016-12-26 14:19 编辑 <br /><br />女生模板
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style type="text/css">
.all{width: 830px;margin: auto;}
.left{float: left;width: 300px;text-align: center;}
.left img{width:300px;height:808px;}
.right{float: left;width: 525px;margin-left: 5px;text-align: center;background:#FCFCFC}
.right img{width:150px;height:150px;margin-left: 5px;margin-top: 5px;border: solid 2px #CDB79E;}
.clear{clear: both;}
.right img{margin-top: 5px;margin-left: 5px;}
.foot{margin-top:20px;height: 250px;font-size: 18px;width: 300px;float: left;text-align: center;background:#FCFCFC}
.foot img{width:150px;height:150px;}
.foot a{text-decoration: none;}
.foot a:hover{color: firebrick;}
.foot_a{float: left;width: 525px;margin-left: 5px;margin-top: 20px;height: 250px;background:#FCFCFC;font-family:"微软雅黑";font-size:15px;}
.foot_a li{margin-left: 20px;}
.foot_a a{text-decoration: none;margin-left: 15px;color:#CDB79E;}
.foot_a a:hover{color: red;}
.clear_a{clear: both;}
.foot_b{margin-top: 30px;width: 830px;height: 200px;background: #FCFCFC;text-align: center;}
.foot_b img{margin-left: 5px;width: 150px;height: 150px;border: solid 2px #CDB79E;}
.foot_c{margin-top: 10px;width: 830px;height: 50px;background: #FCFCFC;text-align: center;font-weight: bold;line-height: 50px;color: #CDB79E;font-size:20px}
</style>
</head>
<body>
<div class="all">
<div class="left">
http://attachment.qqmcc.net/attachment/album/201612/26/133617pdud3pookjzojyuq.jpg
</div>
<div class="right">
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
</div>
<div class="clear"></div>
<div class="foot">
<br/>
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<br/><a href="http://www.qqmcc.net/">作者</a><hr />
</div>
<div class="foot_a">
<br />
<a href="http://www.qqmcc.net/forum.php/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
<a href="http://www.qqmcc.net/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
<a href="http://www.qqmcc.net/">点击到首页，可以是往期作品链接，鼠标移动此处变颜色</a><br />
</div>
<div class="clear_a"></div>
<div class="foot_b">
<br/>
http://attachment.qqmcc.net/attachment/album/201612/22/222133rymmteil2mpioyna.png
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
<img src="img/2.jpg" />
</div>
<div class="foot_c">
跌入尘埃
</div>
</div>
</body>
</html>
**** Hidden Message ***** 感谢分享 期待更多优秀作品 看不懂 {:1_125:}{:1_125:} 有论坛头吗
页:
[1]