├── css
└── music.css
├── images
└── music.jpg
├── index.html
└── js
└── music.js
/css/music.css:
--------------------------------------------------------------------------------
1 | *{margin:0;padding:0}
2 | body,html{
3 | position:relative;
4 | width: 100%;
5 | height:100%;
6 | background:#ed8e87;
7 |
8 | }
9 | .box{
10 | width:390px;
11 | position:absolute;
12 | left:50%;
13 | top:50%;
14 | transform:translate(-50%, -50%)
15 | }
16 |
17 | .top-input{
18 | height:50px;
19 | border:1px solid #eee;
20 | width:280px;
21 | /* padding-left:20px; */
22 | border-radius:30px;
23 | outline:none;
24 | }
25 | .btn{
26 | width:100px;
27 | height:50px;
28 | border-radius:15px;
29 | border:1px solid #eee;
30 | background:#fff;
31 | outline:none;
32 | }
33 | img{
34 | width:380px;
35 | height:380px;
36 | margin-top:10px;
37 | margin-bottom:10px;
38 | border-radius:15px;
39 | border-radius:50%;
40 | }
41 | h4 {
42 | text-align: center;
43 | margin-bottom: 20px;
44 | }
45 | .foot{
46 | height:50px;
47 | border:1px solid #eee;
48 | width:390px;
49 | outline:none;
50 | border-radius:30px;
51 | border-radius:30px;
52 | }
--------------------------------------------------------------------------------
/images/music.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/zoubaishuang/homework/9c7fe88f71670057521c42bbe7ec487dfbe22018/images/music.jpg
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | Document
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
网易云音乐
17 |
18 |