悸动， 发表于 2017-1-3 17:12:46

H码头像表格Ⅶ

注意：请勿使用兼容模式查看。

<style>
li{list-style-type:none;}
#jd{width:950px;margin:0 auto;height:1760px;}
#jdtou{width:100%;height:250px;}
#jdtou img{width:100%;height:250px;}
#jdnav {line-height: 41px;width:100%;height:40px;background-color: #333;overflow: hidden;}
#jdnav ul {list-style-type: none; width:450px;margin:0 auto}
#jdnav ul li {float: left;margin: 0;list-style: none;}
#jdnav li a{padding: 10px 20px;text-decoration:none;color: #fff;}
#jdnav li a:hover {padding: 15px 20px;color: #333;background-color: #ddd;}
#jdtx {margin-top:50px;}
#jdtx ul {width:860px;margin:0 auto;}
#jdtx li {height:200px;width:200px;float: left;list-style: none;margin:5px;padding:0;}
#jdtx li img {height:200px;width:200px;opacity:1.0;filter:alpha(opacity=100);}
#jdtx li img:hover {opacity:0.5;filter:alpha(opacity=50);}
#jdtx li a {text-decoration:none;}
#jdtx li a:hover {}

#jdss{margin: 0 auto;width:400px;}
#ss1{border-radius: 50px;border: 0;background-color: rgba(0, 0, 0, 0.35);width: 320px;height: 35px;position: absolute;margin-top: 110px;padding: 0 15px;}
#ss1:hover{background-color: rgba(0, 0, 0, 0.85);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#jddi {width:100%;height:250px;float: left;margin-top: 50px;}
#jddi img {width:100%;height:250px;}
#ss2{border-radius: 50px;border: 0;background-color: rgba(0, 0, 0, 0.35);width: 320px;height: 35px;padding: 0 15px;}
#ss2:hover{background-color: rgba(0, 0, 0, 0.85);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#dibu{width: 500px;margin-left: 280px;float: left;margin-top: -160px;}
#ss3{border: 0;background-color: rgba(0, 0, 0, 0.34);color: #ddd;border-radius: 50%;height: 35px;width: 35px;margin-left: 10px;}
#ss3:hover{background-color: rgba(0, 0, 0, 0.84);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
</style>
<div id="jd">
<div id="jdss" class="a-fadeinB"><input type="text" id="ss1" name="s" placeholder="搜一搜"><div style="position: absolute;padding-top: 115px;margin-left: 315px;">http://attachment.qqmcc.net/attachment/album/201701/03/171048pj991sz145wg3j3a.png</div></div>
<div id="jdtou" class="a-fadein">http://attachment.qqmcc.net/attachment/album/201701/03/171048xy90wsascwq3vuqg.jpg</div>
<div id="jdnav" class="a-fadeinT">
<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="javascript:alert('·定制H码表格 请联系悸动，QQ：1098816988.');">定做H码表格</a></li>
</ul>
</div>
<div id="jdtx" class="a-fadeinB">
<ul>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
</ul>
</div>
<div id="jddi">https://www.qqmcc.net/data/attachment/album/202310/09/115614n4qohoffu4yloozh.jpg.thumb.jpg</div>
<div id="dibu"><input type="text" id="ss2" name="s" placeholder="点击编辑文字"><button id="ss3"><a href="javascript:alert('·不好意思，你按了个假按钮。.');">发送</a></button></div>
<div style="float: left;margin-top: -22px;margin-left: 380px;color: rgba(255, 255, 255, 0.37);">© 2001-2017 H码表格 by JIDONG</div>



</div>

悸动， 发表于 2017-1-3 18:29:52


注意：请勿使用兼容模式查看。
<style>
li{list-style-type:none;}
#jd{width:950px;margin:0 auto;height:1760px;}
#jdtou{width:100%;height:250px;}
#jdtou img{width:100%;height:250px;}
#jdnav {line-height: 41px;width:100%;height:40px;background-color: #333;overflow: hidden;}
#jdnav ul {list-style-type: none; width:450px;margin:0 auto}
#jdnav ul li {float: left;margin: 0;list-style: none;}
#jdnav li a{padding: 10px 20px;text-decoration:none;color: #fff;}
#jdnav li a:hover {padding: 15px 20px;color: #333;background-color: #ddd;}
#jdtx {margin-top:50px;}
#jdtx ul {width:860px;margin:0 auto;}
#jdtx li {height:200px;width:200px;float: left;list-style: none;margin:5px;padding:0;}
#jdtx li img {height:200px;width:200px;opacity:1.0;filter:alpha(opacity=100);}
#jdtx li img:hover {opacity:0.5;filter:alpha(opacity=50);}
#jdtx li a {text-decoration:none;}
#jdtx li a:hover {}

#jdss{margin: 0 auto;width:400px;}
#ss1{border-radius: 50px;border: 0;background-color: rgba(0, 0, 0, 0.35);width: 320px;height: 35px;position: absolute;margin-top: 110px;padding: 0 15px;}
#ss1:hover{background-color: rgba(0, 0, 0, 0.85);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#jddi {width:100%;height:250px;float: left;margin-top: 50px;}
#jddi img {width:100%;height:250px;}
#ss2{border-radius: 50px;border: 0;background-color: rgba(0, 0, 0, 0.35);width: 320px;height: 35px;padding: 0 15px;}
#ss2:hover{background-color: rgba(0, 0, 0, 0.85);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
#dibu{width: 500px;margin-left: 280px;float: left;margin-top: -160px;}
#ss3{border: 0;background-color: rgba(0, 0, 0, 0.34);color: #ddd;border-radius: 50%;height: 35px;width: 35px;margin-left: 10px;}
#ss3:hover{background-color: rgba(0, 0, 0, 0.84);-moz-transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;}
</style>
<div id="jd">
<div id="jdss" class="a-fadeinB"><input type="text" id="ss1" name="s" placeholder="搜一搜"><div style="position: absolute;padding-top: 115px;margin-left: 315px;">http://attachment.qqmcc.net/attachment/album/201701/03/171048pj991sz145wg3j3a.png</div></div>
<div id="jdtou" class="a-fadein">http://attachment.qqmcc.net/attachment/album/201701/03/171048xy90wsascwq3vuqg.jpg</div>
<div id="jdnav" class="a-fadeinT">
<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="javascript:alert('·定制H码表格 请联系悸动，QQ：1098816988.');">定做H码表格</a></li>
</ul>
</div>
<div id="jdtx" class="a-fadeinB">
<ul>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
<li>http://attachment.qqmcc.net/attachment/album/201612/01/092728olrt2x9kra9l3t3j.png</li>
</ul>
</div>
<div id="jddi">http://attachment.qqmcc.net/attachment/album/201701/03/171048erraryinuycbbwas.jpg</div>
<div id="dibu"><input type="text" id="ss2" name="s" placeholder="点击编辑文字"><button id="ss3">发送</button></div>
<div style="float: left;margin-top: -22px;margin-left: 380px;color: rgba(255, 255, 255, 0.37);">© 2001-2017 H码表格 by JIDONG</div>



</div>

QQmcc-阿卓 发表于 2017-6-20 13:37:59

谢谢分享         

爱你痛彻我心扉 发表于 2017-7-19 16:20:13

感谢分享

橘猫与鱼 发表于 2017-9-9 22:02:30

H码头像表格
页: [1]
查看完整版本: H码头像表格Ⅶ