[测试发帖] 头像表格2

阅读：27回复：1

- 回复楼主
- 发消息
- 举报
- 使用道具
- 加好友
- 引用
- 收藏
乔生 (元老)

楼主 2017-03-10

— 本帖被乔生从社区服务移动到本区(2023-07-11) —

对不起!您没有登录,请先登录论坛.
[ 此帖被乔生在2023-07-14 00:59重新编辑 ]

分享
倒序阅读只看楼主

- 回复
- 发消息
- 举报
- 使用道具
- 加好友
- 引用
- 收藏
乔生 (元老)

沙发 2017-03-10
复制代码
<style>
a,.img img{    text-decoration: none;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
#jdda{width: 100%;height: auto;background-color: #DCDCDC;padding: 80px 0; font-family: 宋体;font-size: 13px;}
#jd {width: 560px;margin: 0 auto;}
#jdtou {width: 100%;height: 40px;}
#jdlogo{float: left;width: 150px;}
#jdnav{float: right;height: auto;background-color: #fff;margin-top: 8px;}
#jdnav ul{margin: 0;}
#jdnav li{float: left;height: 30px;list-style: none;margin: 0;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
#jdnav li:hover {background-color: #FF5F83;}
#jdnav li a {color: #FF5F83;font-size: 13px;line-height: 30px;margin: 0 10px;letter-spacing: 1px;    text-decoration: none;}
#jdnav li a:hover{color:#fff;}
#jdtx {background-color: #fff;width: 520px;height:2200px;margin-top: 30px;padding: 20px;}
#jdtx ul{width: 430px;margin: 0 auto;}
#jdtx li {width: 200px;height: 200px;float:left;margin:5px;list-style: none;}
#jdtx li img{width: 200px;height: 200px;opacity:1.0;filter:alpha(opacity=100);-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
#jdtx li img:hover{opacity:0.4;filter:alpha(opacity=40);}
#jdtx li em { position: absolute;z-index: 99;background-color: rgba(0, 0, 0, 0.32); margin-top: 10px;  margin-left: -200px;padding: 1px 10px; letter-spacing: 2px;color: #DCDCDC;}
#jdtxbt{border-left: 4px solid #FF5F83;height: 20px;line-height: 20px;padding: 0 10px;letter-spacing: 1px;margin: 0 20px 10px;color: #666;}
#jdfy {}
#jdfy ul{margin-top: 20px;float: left;}
#jdfy li{margin: 6px;line-height: 12px;float: left;padding: 6px;height: 12px;width: 12px;background-color: #ddd;list-style: none;text-align: center;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
#jdfy li:hover{background-color:#FF5F83;color: #fff;}
#fy1{background-color:#FF5F83!important;color:#fff; }
</style>
<div id="jdda">
<div id="jd">
<div id="jdtou" class="a-fadeinT">
<div id="jdlogo" class="a-bounceinT">[img]http://attachment.qqmcc.wang/attachment/album/201701/04/182745bvffoh1lp33coyzn.png[/img]</div>
<div id="jdnav">
<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>
</ul>
</div>
</div>
<div id="jdtx" class="a-fadeinB">
<div id="jdtxbt">精选头像</div>
<ul class="a-fadeinB">
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
<li>[img]http://attachment.qqmcc.wang/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png[/img]<em>推荐</em></li>
</ul>
<div id="jdfy">
<ul>
<li id="fy1">1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>》</li>
</ul>
</div>
</div>
<div style="text-align: center;line-height: 50px;letter-spacing: 1px;color: #666">Powered by nanxun</div>
</div>
</div>

点击查看更多