-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcenter.html
122 lines (109 loc) · 4.15 KB
/
center.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<script src="jquery-1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<style>
*{ padding:0; margin:0;line-height:28px;}
.header{ position:relative; height:200px; background:url(images/banner.png) no-repeat; background-size:100%;text-align:center; vertical-align:middle; padding:20px; }
.nav{ margin-bottom:10px; margin:auto;}
.nav ul{ text-decoration:none; list-style:none;text-align:center; padding:0; margin:0}
.nav ul li ul{ text-decoration:none; list-style:none;text-align:center; padding:0; margin:0 ; width:100%; display:none; position:absolute;}
.header b{ font-size:36px;text-shadow:#333 5 5; }
.nav ul li{ float:left; width:16.6%; color:#fff; border:#999 1px solid; background:url(images/banner2.jpg); position:relative;}
.nav ul li ul li{ float:left;color:#fff; border:#999 1px solid; background:url(images/banner2.jpg);width:100%}
a{
color:#fff;}
a:hover{
color:#000}
.footer{text-align: center;vertical-align: middle; background:#333; padding:20px; color:#a4a1a0}
.nav li:hover ul{
display:block;}
.content{ padding:40px; height:1000px;}
td{ padding:10px 0 10px 0;}
</style>
</head>
<body>
<div class="header">
<img src="images/ling.png" width="200" style="position:absolute; right:50px;">
<b><i>个人音乐网站</i></b>
</div>
<div class="nav">
<ul>
<li><a href="index.html">主页</a></li>
<li><a href="center.html">我的</a>
<ul>
<li><a href="center.html">我的收藏</a></li>
<li><a href="myInfo.html">我的信息</a></li>
</ul>
</li>
<li><a href="localMusic.html">本地音乐</a></li>
<li><a href="musicTable.html">我的歌单</a></li>
<li><a href="lately.html">最近播放</a></li>
<li><a href="contact.html">联系我</a></li>
</ul>
</div>
<div class="content">
<table width="100%" border="0" align="center">
<tr style="border-bottom:#999 1px solid; ">
<td></td>
<td><strong>音乐标题</strong></td>
<td><strong>歌手</strong></td>
<td><strong>专辑</strong></td>
<td><strong>时长</strong></td>
<td> </td>
</tr>
<tr style="border-bottom:#999 1px solid">
<td ><img src="images/r1.jpg" style="border-radius:50%" width="100"></td>
<td>不轻</td>
<td>玄子</td>
<td>不轻</td>
<td>03：07</td>
<td style="border-bottom:#999 1px solid"><img src="images/play.png" width="25"></td>
</tr>
<tr style="border-bottom:#999 1px solid">
<td><img src="images/r2.jpg" style="border-radius:50%" width="100" ></td>
<td>你一定会红</td>
<td>简弘亦</td>
<td> </td>
<td>04：08</td>
<td><img src="images/play.png" width="25"></td>
</tr>
<tr style="border-bottom:#999 1px solid">
<td><img src="images/t4.JPG" style="border-radius:50%" width="100"></td>
<td>好心分手</td>
<td>卢巧音</td>
<td>dream again</td>
<td>03：00</td>
<td><img src="images/play.png" width="25"></td>
</tr>
<tr style="border-bottom:#999 1px solid">
<td><img src="images/t8.JPG" style="border-radius:50%" width="100"></td>
<td>只要平凡</td>
<td>张杰</td>
<td>只要平凡</td>
<td>03：19</td>
<td><img src="images/play.png" width="25"></td>
</tr>
<tr style="border-bottom:#999 1px solid">
<td><img src="images/t9.JPG" style="border-radius:50%" width="100"></td>
<td>小半</td>
<td>陈粒</td>
<td>小梦大半</td>
<td>04：57</td>
<td><img src="images/play.png" width="25"></td>
</tr>
</table>
</div>
</div>
<div class="footer">
<div> 版权所有©计科166-08刘慧玲®</div>
</div>
</body>
</html>