1 <!DOCTYPE html>
2 <html>
3 <head lang="en">
4 <meta charset="UTF-8">
5 <title></title>
6 <style type="text/css">
7 *{
8 margin: 0px;
9 padding: 0px;
10 list-style-type: none;
11 text-decoration: none;
12 }
13 body{
14 background-color: rgb(242,242,242);
15 }
16 span a{
17 font-size: 12px;
18 }
19 .backg-styl{
20 background-image: url("imgs/bgz.jpg");
21 width: 1060px;
22 margin: 0px auto;
23 background-repeat: repeat-y;
24 }
25 .text-styl{
26 width: 1000px;
27 margin: 0px auto;
28 }
29 .bg-styl{
30 background-image: url("imgs/top.jpg");
31 height: 150px;
32 width: 1000px;
33 background-repeat: no-repeat;
34 background-position: 0px 0px;
35 }
36 .lian-styl >span{
37 font-size: 12px;
38 float: right;
39 margin-right: 5px;
40 }
41 .daohang-styl{
42 background-color: #275d89;
43 }
44 .daohang-styl >ul >li{
45 float: left;
46 padding: 5px 29px;
47 background-image: url("imgs/solid.gif");
48 background-position: right center;
49 background-repeat: no-repeat;
50 }
51 .daohang-styl >ul >li:hover{
52 background-color: #1f4a6e;
53 }
54 .daohang-styl a{
55 color: white;
56 font-size: 14px;
57 }
58 .daohang-styl a:hover{
59 text-decoration: none;
60 }
61 .gy-styl{
62 padding: 0px 5px;
63 background-color: #f7f7f7;
64 color: #666666;
65 border: 1px solid #e6e6e6;
66 width: 987px;
67 }
68 .gyu-styl >span{
69 padding: 5px 7px;
70 float: left;
71 font-size: 12px;
72 }
73 .sousuo-styl{
74 display: inline-block;
75 vertical-align: top;
76 padding: 5px 42px;
77 float: right;
78 }
79 .gy-styl.sousuo-styl{
80 vertical-align: top;
81 display: inline-block;
82 padding-top: 4px;
83 }
84 .gyu-styl a{
85 color: #666666;
86 }
87 .sousuo-styl >span{
88 font-size: 12px;
89 }
90 .big-styl{
91 height: 500px;
92 width: 997px;
93 padding: 9px 0px 0px 0px;
94 border: 1px solid #f0f0f0;
95 }
96 .bk-styl{
97 background-color:#f7f7f7 ;
98 padding: 1px 0px 0px 0px;
99 width: 194px;
100 height: 456px;
101 float: left;
102 }
103 .left-styl li{
104 margin-top: 0px;
105 }
106 .right-styl{
107 width: 707px;
108 height: 431px;
109 float: right;
110 margin-right: 35px;
111 padding: 0px 15px;
112 border: 1px solid #f0f0f0;
113 }
114 .top-styl{
115 width: 721px;
116 height: 208px;
117 padding: 0px 0px 0px 0px;
118 border: 1px solid #f0f0f0;
119 }
120 .top-styl img{
121 float: left;
122 }
123 .rg-styl{
124 float: right;
125 width: 425px;
126 height: 194px;
127 }
128 .rg-styl h1{
129 font-weight: normal;
130 font-size: 18px;
131 float: left;
132 }
133 .rg-styl a{
134 float: right;
135 }
136 .g-styl{
137 color: rgb(25, 68, 118);
138 font-family: "微软雅黑";
139 font-size: 18px;
140 font-weight: normal;
141 }
142 .gg-styl a{
143 color: #f06217;
144 font-size: 12px;
145 }
146 .nn-styl{
147 line-height: 28px;
148 }
149 .nn-styl li{
150 float: left;
151 background: url("imgs/icon.gif") left center no-repeat;
152 padding-left: 5px;
153 }
154 .nn-styl a{
155 font-size: 12px;
156 color: #666666;
157 float: left;
158 }
159 .nn-styl i{
160 font-size: 12px;
161 color: #666666;
162 float: right;
163 }
164 .nrs-styl li{
165 float: left;
166 background: url("imgs/icon.gif") left center no-repeat;
167 padding-left: 5px;
168 }
169 .nrs-styl a{
170 color:#666666;
171 font-size: 12px;
172 }
173 .nrs-styl i{
174 float: right;
175 font-style: normal;
176 color: #666666;
177 }
178 a:hover{
179 text-decoration: underline;
180 }
181 .xia-styl{
182 width: 721px;
183 height: 240px;
184 border: 1px solid #f0f0f0;
185 padding: 0px 0px 0px 0px ;
186 background: url("imgs/casebg.jpg");
187 }
188 .shang-styl{
189 width: 721px;
190 height: 132px;
191 }
192 .zuoyi-styl{
193 float: left;
194 width: 339px;
195 height: 104px;
196 padding: 0px 0px 0px 0px ;
197 }
198 .zuoyi-styl img{
199 padding: 7px 0px 0px 8px ;
200 float: left;
201 }
202 .rgg-styl{
203 width: 203px ;
204 height: 102px;
205 float: right;
206 }
207 .nrss-styl li{
208 float: left;
209 background: url("imgs/icon.gif") left center no-repeat;
210 padding-left: 5px;
211 }
212 .nrss-styl{
213 font-size: 12px;
214 color: #666666;
215 line-height: 28px;
216 float: right;
217 }
218 .youyi-styl{
219 float: right;
220 width: 332px;
221 height: 103px;
222 padding: 0px 0px 0px 0px ;
223 }
224 .youyi-styl img{
225 padding: 7px 0px 0px 8px ;
226 float: left;
227 }
228 .rrgg-styl{
229 width: 197px ;
230 height: 102px;
231 float: right;
232 }
233 .xia1-styl{
234 width: 721px;
235 height: 104px;
236 padding: 0px 0px 12px 0px ;
237 }
238 .zuoer-styl{
239 float: left;
240 width: 354px;
241 height: 114px;
242 padding: 0px 0px 0px 0px ;
243
244 }
245 .zuoer-styl img{
246 padding: 7px 0px 0px 8px ;
247 float: left;
248 }
249 .nrsss-styl{
250 font-size: 12px;
251 color: #666666;
252 line-height: 28px;
253 float: right;
254 }
255 .nrsss-styl li{
256 float: left;
257 background: url("imgs/icon.gif") left center no-repeat;
258 padding-left: 5px;
259 }
260 .zzgg-styl{
261 width: 217px ;
262 height: 102px;
263 float: right;
264 }
265 .youer-styl{
266 float: right;
267 width: 332px;
268 height: 103px;
269 padding: 0px 0px 0px 0px ;
270 }
271 .youer-styl img{
272 padding: 7px 0px 0px 8px ;
273 float: left;
274 }
275 .nrss-styl a{
276 color: #666666;
277 }
278 .ggs-styl a{
279 color: #f06217;
280 font-size: 12px;
281 padding: 0px 15px 0px 0px ;
282 }
283 .nrsss-styl a{
284 color: #666666;
285 }
286 .zui-styl{
287 height: 49px;
288 border-top: 1px solid #e0e0e0;
289 background: #f2f2f2;
290 line-height: 49px;
291 width: 1048px;
292 }
293 .zui-styl p{
294 color: #666666;
295 font-family: "微软雅黑";
296 padding-left: 32px;
297 font-size: 12px;
298 }
299 .yy{
300 text-align: center;
301 }
302 </style>
303 </head>
304 <body>
305 <div class="backg-styl">
306 <div class="text-styl">
307 <div class="bg-styl">
308 <div class="lian-styl">
309 <span>|<a href="#">简体</a></span>
310 <span><a href="#">Deutsch</a></span>
311 <span><a href="#">English </a>||</span>
312 <div style="clear: both"></div>
313 </div>
314 </div>
315 <div class="daohang-styl">
316 <ul>
317 <li style="<a href="#">首页</a></li>
318 <li><a href="#">部门概况</a></li></li>
319 <li><a href="#">校情公开</a></li></li>
320 <li><a href="#">制度规程</a></li></li>
321 <li><a href="#">服务指南</a></li></li>
322 <li><a href="#">工作动态</a></li></li>
323 <li><a href="#">学习资料</a></li></li>
324 <li><a href="#">一周安排</a></li></li>
325 <li><a href="#">简报简讯</a></li></li>
326 </ul>
327 <div style="clear: both"></div>
328 </div>
329 <div class="gy-styl">
330 <div class="gyu-styl">
331 <span>今天是:2014年3月35日 星期二 </span>
332 <span><a href="#">欢迎您访问某某科技学院学校办公室网站!</a></span>
333 </div>
334 <div class="sousuo-styl" >
335 <span>搜索 </span><input type="text" style=" height: 18px"/><input type="button" style="width: 61px" value="查询"/>
336 <div style="clear: both"></div>
337 </div>
338 <div style="clear: both"></div>
339 </div>
340 <div style="height: 10px"></div>
341 <div class="big-styl">
342 <div class="bk-styl">
343 <ul>
344 <li style="margin-top: 0px"><a href="#"> <img src="imgs/n1.jpg" title="协同办公系统" alt="协同办公系统"></a></li>
345 <li><a href="#"> <img src="imgs/n2.jpg" title="信息公开网" alt="信息公开网"></a></li>
346 <li><a href="#"> <img src="imgs/n3.jpg" title="书记校长信箱" alt="书记校长信箱"></a></li>
347 <li><a href="#"> <img src="imgs/n4.jpg" title="相关链接" alt="相关链接"></a></li>
348 <li><a href="#"> <img src="imgs/n5.jpg" title="联系我们" alt="联系我们"></a></li>
349 </ul>
350 <img src="imgs/weixin.jpg">
351 </div>
352 <div class="right-styl" >
353 <div class="top-styl">
354 <img src="imgs/pic.jpg">
355 <div class="rg-styl">
356 <h1 class="g-styl" style="float: left;">工作动态</h1>
357 <span class="gg-styl" style="float: right"><a href="#">更多>></a></span>
358 <div style="clear: both"></div>
359 <ul class="nn-styl">
360 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
361 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
362 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
363 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
364 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
365 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出重要指示</a><i>[2014-04-06]</i></li>
366 </ul>
367 </div>
368 <div style="clear: both"></div>
369 </div>
370
371 <div class="xia-styl">
372 <div class="shang-styl">
373 <div class="zuoyi-styl">
374 <img src="imgs/p1.jpg">
375 <div class="rgg-styl">
376 <h1 class="g-styl" style="float: left">高校视野</h1>
377 <span class="gg-styl" style="float: right"><a href="#">更多>></a></span>
378 <div style="clear: both"></div>
379 <ul class="nrss-styl">
380 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出</a></li>
381 <li><a href="#">美国布里奇波特大学校长一行访问我</a></li>
382 <li><a href="#">巴比什波雅依大学孔院参加克鲁日城</a></li>
383 <div style="clear: both"></div>
384 </ul>
385 </div>
386 </div>
387 <div class="youyi-styl">
388 <img src="imgs/p2.jpg">
389 <div class="rrgg-styl">
390 <h1 class="g-styl" style="float: left">服务指南</h1>
391 <span class="gg-styl" style="float: right"><a href="#">更多>></a></span>
392 <div style="clear: both"></div>
393 <ul class="nrss-styl">
394 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出</a></li>
395 <li><a href="#">美国布里奇波特大学校长一行访问我</a></li>
396 <li><a href="#">巴比什波雅依大学孔院参加克鲁日城</a></li>
397 <div style="clear: both"></div>
398 </ul>
399 </div>
400 </div>
401 <div style="clear: both"></div>
402 </div>
403 <div class="xia1-styl">
404 <div class="zuoer-styl">
405 <img src="imgs/p3.jpg">
406 <div class="zzgg-styl">
407 <h1 class="g-styl" style="float: left">简报简讯</h1>
408 <span class="ggs-styl" style="float: right"><a href="#">更多>></a></span>
409 <div style="clear: both"></div>
410 <ul class="nrsss-styl">
411 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出</a></li>
412 <li><a href="#">美国布里奇波特大学校长一行访问我</a></li>
413 <li><a href="#">巴比什波雅依大学孔院参加克鲁日城</a></li>
414 <div style="clear: both"></div>
415 </ul>
416 </div>
417 </div>
418 <div class="youer-styl">
419 <img src="imgs/p4.jpg">
420 <div class="rrgg-styl">
421 <h1 class="g-styl" style="float: left">服务指南</h1>
422 <span class="gg-styl" style="float: right"><a href="#">更多>></a></span>
423 <div style="clear: both"></div>
424 <ul class="nrss-styl">
425 <li><a href="#">路甬祥郝平肯定学校发展成绩并作出</a></li>
426 <li><a href="#">美国布里奇波特大学校长一行访问我</a></li>
427 <li><a href="#">巴比什波雅依大学孔院参加克鲁日城</a></li>
428 <div style="clear: both"></div>
429 </ul>
430 </div>
431 </div>
432 </div>
433 </div>
434 </div>
435 </div>
436 </div>
437 <div class="zui-styl">
438 <p>版权所有 某某科技学院校园学校办公室 xb@zust.edu.cn ICP备05014576号 地址:某某市留和路318号 邮编:310023 </p>
439 </div>
440 </div>
441 <div style="clear: both"></div>
442 </div>
443 </div>
444 </div>
445 </div>
446 </div>
447 <div class="yy"><img src="imgs/footyy.jpg"></div>
448 </body>
449 </html>
效果图: