欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

穿越时空的邂逅:为她打造独一无二的QQ空间相册(附带源代码)

最编程 2024-08-07 19:56:19
...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--引入jquery库--> <script src="js/jquery-1.10.2.min.js"></script> <!--引入外部的js--> <script src="js/QQ空间.js"></script> <!--从外部引入css样式--> <link href="css/QQ空间.css" rel="stylesheet" type="text/css"> <style> a{ position: absolute; } </style> </head> <body> <!--整个网页--> <div> <!--头部导航栏--> <div class="header"> <img src="image/qq_logo.png" class="logo"> <!--列表--> <ul> <li>QQ空间</li> <li>个人中心</li> <li>我的主页</li> <li>好友</li> <li>游戏</li> <li>装扮</li> </ul> </div> <!--背景图片个人信息导航栏--> <div class="bg-content"> <div class="bg"></div> <!--会变形--> <!--<img src="image/bj1.png">--> <div class="info"> <img src="image/log.jpg" class="logo"> <!--列表--> <ul> <li>主页</li> <li>日志</li> <li>相册</li> <li>留言板</li> <li>说说</li> <li>个人档</li> <li>音乐</li> <li>更多</li> </ul> </div> </div> <!--相册内容--> <div class="qqContent"> <div class="title">相册</div> <!--<div></div>--> <ul class="image_list"> <!--<div></div>--> <li> <img src="image/1.jpg" class="imgs"> <div class="date">2021/1/8</div> </li><li> <img src="image/2.jpg" class="imgs"> <div class="date">2021/1/9</div> </li> <li> <img src="image/3.jpg" class="imgs"> <div class="date">2021/1/10</div> </li> <li> <img src="image/4.jpg" class="imgs"> <div class="date">2021/1/11</div> </li> <li> <img src="image/5.jpg" class="imgs"> <div class="date">2021/1/11</div> </li> <li> <img src="image/6.jpg" class="imgs"> <div class="date">2021/1/11</div> </li> <li> <img src="image/7.jpg" class="imgs"> <div class="date">2021/1/11</div> </li> </ul> </div> </div> </body> </html>