| <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"> | |
| *{ | |
| margin:0px; | |
| padding:0px;} | |
| body{ | |
| background-image:url(banner.jpg); background-attachment:fixed; background-repeat:no-repeat; background-size:100%} | |
| #a1{ width:100%; height:950px; position:relative; text-align:center;} | |
| .a2{ | |
| width:200px; height:30px; border:1px solid #03F; border-radius:10px; background-color:#09F; cursor:pointer; | |
| position:relative; margin:20px auto; line-height:30px; color:#FFF; transform:0.5s;} | |
| .a2:hover{ | |
| background-color:#0FF | |
| } | |
| #a3{ width:100%; height:950px; position:relative; text-align:center; background-image:url(banner2.jpg); background-repeat:no-repeat; background-size:100%} | |
| #a4{ width:100%; height:950px; position:relative; text-align:center; background-image:url(banner3.jpg); background-repeat:no-repeat; background-size:100%} | |
| #shang{ | |
| width:100%; height:50px; position:fixed; background-color:#000; top:0px; left:0px; opacity:0.5; z-index:2;} | |
| #zuo{ | |
| width:200px; height:50px; position:fixed; top:10px; left:20px; z-index:2; background-image:url(logo-01.png); background-repeat:no-repeat; } | |
| #zhong{ | |
| width:600px; height:50px; color:#FFF; position:fixed; z-index:2; top:15px; right:100px; font-family:"黑体"} | |
| #you{ | |
| width:400px; height:50xp; position:fixed; top:15px; right:100px; z-index:2;} | |
| #aa{ | |
| border-radius:15px; position:fixed; top:10px; right:20px; width:150px; height:25px; background:none;} | |
| .anniu{ | |
| width:80px; height:20px; border:1px solid #03F; position:fixed; top:10px; right:300px; z-index:2; text-align:center; border-radius:6px;} | |
| #cc{ | |
| width:100%; height:350px; position:relative; top:-280px; background-color:#000} | |
| .zz{ | |
| width:240px; height:50px; background-repeat:no-repeat; position:relative;} | |
| .tt{ | |
| width:130px; height:200px; position:absolute; color: #06C;} | |
| </style> | |
| </head> | |
| <body> | |
| <div id="shang"></div> | |
| <div id="zuo"></div> | |
| <div id="zhong"> | |
| <table> | |
| <tr> | |
| <td>首页</td><td> </td> | |
| <td>下载</td><td> </td> | |
| <td>动态</td> <td> </td> | |
| <td>社区</td><td> </td> | |
| <td>智博星</td> | |
| </tr> | |
| </table> | |
| </div> | |
| <div class="anniu">登陆</div> | |
| <div class="anniu" style="top:10px; right:200px; background-color:#03F; color:#FFF" >注册</div> | |
| <div id="you"> <input id="aa" type="text" placeholder="搜索"/></div> | |
| <div id="a1"> | |
| <img src="01.png" style="margin-top:300px";/><br /> | |
| <img src="02 (1).png" style="margin:20px; opacity:0.8" /><br /> | |
| <div class="a2">产品亮点</div><br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <div id="a3"> | |
| <img src=‘01 (1).png‘ style="margin-top:300px";/><br /> | |
| <img src="02 (1).png" style="margin:20px; opacity:0.8" /><br /> | |
| <div class="a2">用户故事</div> | |
| <br /> | |
| <br /> | |
| <br /> | |
| <div id="a4"> | |
| <img src="01 (2).png" style="margin-top:300px";/><br /> | |
| <img src="02 (2).png" style="margin:20px; opacity:0.8" /><br /> | |
| <div class="a2">功能列表</div> | |
| </div> | |
| <div id="cc"> | |
| <div class="zz" style="background-image:url(IOS.png); top:50px; left:300px;"> | |
| <div class="tt" style="top:100px"> | |
| <ul><font color="#FFFFFF" face="宋体" size="+2">支持</font><br /> | |
| <br /> | |
| <li>产品介绍</li><br /> | |
| <li>使用手册</li><br /> | |
| <li>更新日志</li><br /> | |
| <li>案例展示</li> | |
| </ul> | |
| </div> | |
| <div> | |
| <div class="zz" style="background-image:url(AN.png); top:0px; left:300px;"> | |
| <div class="tt" style="top:100px"> | |
| <ul><font color="#FFFFFF" face="宋体" size="+2">公司</font><br /> | |
| <br /> | |
| <li>关于团队</li><br /> | |
| <li>招聘专栏</li><br /> | |
| <li>新闻资讯</li><br /> | |
| <li>合作专栏</li> | |
| </ul> | |
| </div> | |
| <div class="zz" style="background-image:url(PC.png); top:0px; left:300px;"> | |
| <div class="tt" style="top:100px"> | |
| <ul><font color="#FFFFFF" face="宋体" size="+2">支持</font><br /> | |
| <br /> | |
| <li>官方博客</li><br /> | |
| <li>用户社区</li><br /> | |
| <li>隐私声明</li><br /> | |
| <li>服务条款</li> | |
| </ul> | |
| </div></div></div> | |
| </div> | |
| </div> | |
| </body> | |
| </html> |
原文：http://www.cnblogs.com/hq233/p/6091672.html