-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
161 lines (142 loc) · 4.64 KB
/
index.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
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>18物联网张浩的web</title>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
list-style-type: none;
}
.box {
width: 100%;
height: 800px;
position: relative;
background-image: url(自己的作品/img/tencent/12.png);
}
.top {
width: 500px;
height: 100px;
margin: 0 auto;
}
.top p {
color: white;
font-size: 36px;
line-height: 100px;
text-align: center;
}
.main {
width: 1000px;
margin: 0 auto;
}
.left {
float: left;
}
.right {
float: right;
}
a {
color: white;
margin-top: 20px;
height: 50px;
width: 300px;
display: block;
text-align: center;
line-height: 50px;
background-color: seagreen;
border: 1px solid white;
border-radius: 10px;
font-size: 28px;
text-decoration: none;
}
.right a {
width: 400px;
}
a:hover {
color: purple;
}
h2 {
text-align: center;
background-color: sandybrown;
border: 1px solid white;
border-radius: 5px;
}
.clear {
clear: both;
}
.footer {
display: none;
position: absolute;
top: 200px;
left: 650px;
text-align: center;
color: white;
}
.footer table {
text-align: left;
/* border: 1px solid #fff; */
width: 300px;
height: 300px;
font-size: 18px;
}
table td {
font-size: 25px;
}
</style>
</head>
<body>
<div class="box">
<div class="top">
<p>网页设计</p>
</div>
<div class="main">
<div class="left">
<h2>课堂上的作品</h2>
<ul>
<li><a href="freshskin/index.html">freshskin</a></li>
<li><a href="人民网/3.html">人民网</a></li>
<li><a href="淘宝网/index.html">淘宝网</a></li>
<li><a href="shopping/index.html">品优购</a></li>
<li><a href="demo1(流式布局)/m-jd.html">流式布局</a></li>
<li><a href="demo3(rem适配布局)/index.html">rem适配布局</a></li>
<li><a href="响应式布局/index.html">响应式布局</a></li>
<li><a href="demo2（flex布局new)/index.html">flex布局</a></li>
<li><a href="./13-todolist/tudolist.html">简单的任务清单</a></li>
</ul>
</div>
<div class="right">
<h2>自己的作品</h2>
<ul>
<li><a href="自己的作品/index.html">1.主界面</a></li>
<li><a href="自己的作品/about.html">2.关于极光计划</a></li>
<li><a href="自己的作品/intro.html">3.极光计划简介</a></li>
<li><a href="自己的作品/merit.html">4.极光优势</a></li>
<li><a href="自己的作品/tencent game.html">5.腾讯游戏</a></li>
<li><a href="./hhstu-gxb/index.html">6.黄科index(适配移动端)</a></li>
<li><a href="./hhstu-gxb/list.html">7.黄科list(适配移动端)</a></li>
<li><a href="./hhstu-gxb/news.html">8.黄科news(适配移动端)</a></li>
<li><a href="./charts-project/index.html">可视化界面</a></li>
</ul>
<div class="clear"></div>
</div>
<div class="footer">
<table cellspacing="" cellpadding="">
<tr>
<td>班级：</td>
<td>B181物联网工程</td>
</tr>
<tr>
<td>姓名：</td>
<td>张 浩</td>
</tr>
<tr>
<td>学号：</td>
<td>1801141085</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>