-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
302 lines (300 loc) · 13 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
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>微主页</title>
<meta name="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style type="text/css">
/*.main-wrapper{
list-style-type: disc;
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 10px
}
.main-list{
display: list-item;
list-style: disc;
text-align:
-webkit-match-parent;
}*/
</style>
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/header-footer.css" />
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/index.css" />
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<nav id="menu">
<div class="menu-content">
<div class="menu-header">
<div class="header-wrapper"><img class="person-header" src="images/header.png"/></div>
<div class="person-info">重邮学子</div><br/>
<div style="margin-top: 10px;" class="menu-line"></div>
</div>
<div class="menu-main">
<div class="none">
<div class="menu-line"></div>
</div>
<ul class="menu-list-wrapper">
<li class="menu-list">
<div style="float: left">
<div class="menu-line"></div>
<div class="menu-circle">
<img src="images/circle.png" alt="">
</div>
<div class="menu-line"></div>
</div>
<div class="menu-detail"style="background-color: #dde0e2">
<img src="images/person.png">
<span style="color: #8e3006;" class="person-detail">个人信息</span>
</div>
</li>
<li class="menu-list">
<div style="float: left">
<div class="menu-line"></div>
<div class="menu-circle">
<img src="images/circle.png" alt="">
</div>
<div class="menu-line"></div>
</div>
<div class="menu-detail">
<img src="images/small-search.png">
<span class="person-detail">我的百科</span>
</div>
</li>
<li class="menu-list">
<div style="float: left">
<div class="menu-line"></div>
<div class="menu-circle">
<img src="images/circle.png" alt="">
</div>
<div class="menu-line"></div>
</div>
<div class="menu-detail">
<img src="images/heart.png">
<span class="person-detail">我的预约</span>
</div>
</li>
<li class="menu-list">
<div style="float: left">
<div class="menu-line"></div>
<div class="menu-circle">
<img src="images/circle.png" alt="">
</div>
<div class="menu-line"></div>
</div>
<div class="menu-detail">
<img src="images/book.png">
<span class="person-detail">我的党校</span>
</div>
</li>
<li class="menu-list">
<div style="float: left">
<div class="menu-line"></div>
<div class="menu-circle">
<img src="images/circle.png" alt="">
</div>
</div>
<div class="menu-detail">
<img src="images/other.png">
<span class="person-detail">其       他</span>
</div>
</li>
</ul>
</div>
</div>
</nav>
<main id="panel">
<div class="content">
<div id="myCarousel" class="carousel slide">
<!-- 轮播下方小圆点 -->
<ol class="carousel-indicators" style="margin-bottom: 0px;">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- 轮播部分 -->
<div class="carousel-inner">
<!--<div class="words-wrapper"></div>-->
<div class="item active">
<img src="images/mainPage/topPic.png"class="img-responsive center-block pic-width" alt="First slide">
<div style="padding-top:10px;padding-bottom: 10px;bottom: 0px;" class="carousel-caption pic-explain">【重庆邮电大学】是工业和信息化部与重庆市共建的一所教学研究型大学，也与军事、民用相结合，以信息科学技术为特色的省部共建重点高校</div>
</div>
<div class="item">
<img src="images/mainPage/topPic.png"class="img-responsive center-block pic-width" alt="Second slide">
<div style="padding-top:10px;padding-bottom: 10px;bottom: 0px;" class="carousel-caption pic-explain">【重庆邮电大学】是工业和信息化部与重庆市共建的一所教学研究型大学，也与军事、民用相结合，以信息科学技术为特色的省部共建重点高校</div>
</div>
<div class="item">
<img src="images/mainPage/topPic.png"class="img-responsive center-block pic-width" alt="Third slide">
<div style="padding-top:10px;padding-bottom: 10px;bottom: 0px;" class="carousel-caption pic-explain">【重庆邮电大学】是工业和信息化部与重庆市共建的一所教学研究型大学，也与军事、民用相结合，以信息科学技术为特色的省部共建重点高校</div>
</div>
</div>
</div>
<div class="light"></div>
<div class="new-nav">
<ul class="new-nav-wrapper">
<li class="new-nav-list toggle-button">个人中心</li>
<li class="new-nav-list"><a href="">重邮百科</a></li>
<li class="new-nav-list"><a href="">重邮图库</a></li>
<li class="new-nav-list"><a href="">服务预约</a></li>
<li style="border-right: solid 1px #ececec;" class="new-nav-list"><a href="">党校学习</a></li>
</ul>
</div>
<div class="new-content">
<div class="content-left left">
<div class="content-encyclopedia bgc">
<div class="content-en-header">
<img class="img-responsive" src="images/mainPage/cy-search.png"/>
<h4 class="en-title">重邮百科</h4>
<span class="more right"><a href="">更多></a></span>
</div>
<div class="main-en">
<div class="main-pics">
<div class="en-main-pic">
<div class="en-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="en-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
<div class="en-main-pic">
<div class="en-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="en-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
</div>
<ul class="main-wrapper">
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>香樟园</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>信科</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>风雨操场</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>规划院</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>太极操场</a></li>
</ul>
</div>
</div>
<div class="content-pics bgc">
<div class="content-pic-header">
<img class="img-responsive" src="images/mainPage/cy-pic.png"/>
<h4 class="pic-title">重邮图库</h4>
<span class="more right"><a href="">更多></a></span>
</div>
<div class="main-pic">
<div class="main-pics">
<div class="pic-main-pic">
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
<div class="pic-main-pic">
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
<div class="pic-main-pic">
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="pic-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
</div>
<ul class="main-wrapper">
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>香樟园</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>信科</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>风雨操场</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>规划院</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>太极操场</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>信科</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>风雨操场</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>规划院</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>太极操场</a></li>
</ul>
</div>
</div>
</div>
<div class="content-right left">
<div class="bgc content-advice">
<div class="content-advice-header">
<img class="img-responsive" src="images/mainPage/cy-person.png"/>
<h4 class="advice-title">意见建议</h4>
<span class="more right"><a href="">更多></a></span>
</div>
<div class="main-advice">
<div class="firstline">
<div class="left"><a href="">关于百科</a></div>
<div class="right"><a href="">关于预约</a></div>
</div>
<div class="secondline">
<div class="left"><a href="">关于图库</a></div>
<div class="right"><a href="">其他意见</a></div>
</div>
</div>
</div>
<div class="bgc content-school">
<div class="content-study-header">
<img class="img-responsive" src="images/mainPage/cy-search.png"/>
<h4 class="study-title">党校学习</h4>
<span class="more right"><a href="">更多></a></span>
</div>
<div class="main-study">
<div class="main-pics">
<div class="study-main-pic">
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
<div class="study-main-pic">
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
<div class="study-main-pic">
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
<div class="study-pic"><img src="images/mainPage/picc.png" alt="" class="img-responsive"/></div>
</div>
</div>
<ul class="main-wrapper">
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>香樟园</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>信科</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>风雨操场</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>规划院</a></li>
<li class="main-list"><a href=""><span class="point"><img src="images/mainPage/point.png"/></span>太极操场</a></li>
</ul>
</div>
</div>
<div class="bgc content-service">
<div class="content-advice-header">
<img class="img-responsive" src="images/mainPage/cy-clock.png"/>
<h4 class="advice-title">预约服务</h4>
<span class="more right"><a href="">更多></a></span>
</div>
<div class="main-advice">
<div class="firstline">
<div class="left"><a href="">学业预约</a></div>
<div class="right"><a href="">心理预约</a></div>
</div>
<div class="secondline">
<div class="left"><a href="">预约结果</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<div class="footer">
微校微+工作室出品
</div>
<script src="js/slideout.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
//轮播自动播放
$('.carousel').carousel({
interval: 3000
})
var slideout = new Slideout({
'panel': document.getElementById('panel'),
'menu': document.getElementById('menu'),
'padding': 256,
'tolerance': 70
});
// Toggle button
document.querySelector('.toggle-button').addEventListener('click', function() {
slideout.toggle();
});
</script>
</body>
</html>