1
1
<!DOCTYPE html>
2
2
< html >
3
+ < < < < < < < HEAD
3
4
< head >
4
5
< meta charset ="utf-8 ">
5
6
@@ -184,4 +185,315 @@ <h3 class="widget-title">最新文章</h3>
184
185
185
186
</ div >
186
187
</ body >
188
+ =======
189
+ <!-- 一直在模仿 还没有创新-->
190
+
191
+ < head >
192
+ < meta charset ="utf-8 ">
193
+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge,chrome=1 " />
194
+ < title > Newmedio</ title >
195
+ < style type ="text/css ">
196
+ * {
197
+ margin : 0 ;
198
+ padding : 0 ;
199
+ }
200
+
201
+ li {
202
+ list-style : none;
203
+ }
204
+
205
+ a {
206
+ text-decoration : none;
207
+ color : # 285D33 ;
208
+ font-size : 18px ;
209
+ }
210
+
211
+ body {
212
+ background : # f1f1f1 ;
213
+ font-family : "TIBch" , "Classic Grotesque W01" , "Helvetica Neue" , Arial, "Hiragino Sans GB" , "STHeiti" , "Microsoft YaHei" , "WenQuanYi Micro Hei" , SimSun, sans-serif;
214
+ }
215
+ /*header style*/
216
+
217
+ # wrap {
218
+ background : # 00C9FF ;
219
+ /* fallback for old browsers */
220
+ background : -webkit-linear-gradient (to left, # 00C9FF, # 92FE9D );
221
+ /* Chrome 10-25, Safari 5.1-6 */
222
+ background : linear-gradient (to left, # 00C9FF, # 92FE9D );
223
+ /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
224
+ max-height : 500px ;
225
+ }
226
+
227
+ header {
228
+ background : rgba (0 , 0 , 0 , 0.05 );
229
+ overflow : hidden;
230
+ position : relative;
231
+ }
232
+
233
+ h1 {
234
+ height : inherit;
235
+ width : 200px ;
236
+ float : left;
237
+ margin-left : 5px ;
238
+ }
239
+
240
+ .logo {
241
+ color : white;
242
+ font-size : 22px ;
243
+ font-weight : 700 ;
244
+ display : block;
245
+ height : 40px ;
246
+ line-height : 40px ;
247
+ text-decoration : none;
248
+ }
249
+
250
+ .menu-bar ul {
251
+ list-style : none;
252
+ height : 40px ;
253
+ float : right;
254
+ }
255
+
256
+ .menu-bar ul li {
257
+ display : inline-block;
258
+ height : inherit;
259
+ }
260
+
261
+ .page-link {
262
+ display : block;
263
+ height : 40px ;
264
+ line-height : 40px ;
265
+ text-decoration : none;
266
+ color : white;
267
+ font-size : 20px ;
268
+ padding : 0 10px ;
269
+ }
270
+
271
+ .active {
272
+ color : white;
273
+ }
274
+
275
+ .page-link : hover {
276
+ color : # 0197bd ;
277
+ }
278
+
279
+ .head-v {
280
+ height : 300px ;
281
+ font-size : 70px ;
282
+ padding : 50px ;
283
+ width : 50% ;
284
+ margin : 0 auto;
285
+ text-align : center;
286
+ line-height : 150px ;
287
+ color : # FFFFFF ;
288
+ }
289
+
290
+ .font-sm {
291
+ font-size : 14px ;
292
+ }
293
+
294
+ .vid {
295
+ margin : auto;
296
+ width : 530px ;
297
+ height : 300px ;
298
+ }
299
+ /*page style*/
300
+
301
+ .page-content {
302
+ margin : 0 auto;
303
+ max-width : 1300px ;
304
+ padding : 0 10px ;
305
+ }
306
+
307
+ .wrapper {}
308
+
309
+ .main-left {
310
+ width : 70% ;
311
+ float : left;
312
+ }
313
+
314
+ .post-list {
315
+ background : white none repeat scroll 0 0 ;
316
+ padding : 10px 30px ;
317
+ margin : 10px ;
318
+ }
319
+
320
+ .post-title {
321
+ color : # 285D33 ;
322
+ }
323
+
324
+ .post-meta {
325
+ font-size : 14px ;
326
+ color : # aaa ;
327
+ }
328
+
329
+ pre {
330
+ font-size : 20px ;
331
+ color : # 285D11 ;
332
+ }
333
+
334
+ .main-right {
335
+ width : 30% ;
336
+ float : left;
337
+ }
338
+
339
+ .search {
340
+ background : white none repeat scroll 0 0 ;
341
+ margin : 10px 0px 10px 10px ;
342
+ padding : 10px ;
343
+ }
344
+
345
+ .search-box {
346
+ border : 1px solid # bbb ;
347
+ border-radius : 6px ;
348
+ font-size : 16px ;
349
+ }
350
+
351
+ .soso {
352
+ background : # 00C9FF none repeat scroll 0 0 ;
353
+ margin-left : 10px ;
354
+ border-radius : 6px ;
355
+ padding : 3px ;
356
+ font-size : 16px ;
357
+ color : white;
358
+ line-height : 21px ;
359
+ }
360
+
361
+ .friend-link {
362
+ color : # 285D33 ;
363
+ font-size : 25px ;
364
+ }
365
+
366
+ .site-footer {
367
+ height : 50px ;
368
+ }
369
+
370
+ .footer-wrapper p {
371
+ margin : 0 auto;
372
+ padding : 10 0 ;
373
+ width : 20% ;
374
+ text-align : center;
375
+ }
376
+
377
+ .clear {
378
+ clear : both;
379
+ }
380
+ </ style >
381
+ </ head >
382
+
383
+ < body >
384
+
385
+ < div id ="wrap ">
386
+ < header >
387
+ < h1 >
388
+ < a class ="logo " href ="/ "> Newmedio logo</ a >
389
+ </ h1 >
390
+ < nav class ="menu-bar ">
391
+ < ul >
392
+ < li > < a class ="page-link active " href ="/ "> Home</ a > </ li >
393
+
394
+ < li > < a class ="page-link " href ="/ "> Demo</ a > </ li >
395
+
396
+ < li > < a class ="page-link " href ="/ "> Demo</ a > </ li >
397
+
398
+ < li > < a class ="page-link " href ="/ "> Help</ a > </ li >
399
+
400
+ </ ul >
401
+ </ nav >
402
+ <!-- <button id="menu-icon">
403
+ <span></span>
404
+ <span></span>
405
+ <span></span>
406
+ </button> -->
407
+ </ header >
408
+ < div class ="head-v ">
409
+ New Blog
410
+ < div class ="font-sm ">
411
+ this is a demo!
412
+ </ div >
413
+ </ div >
414
+ </ div >
415
+
416
+ <!-- 借用新媒体微信公众号中的文章
417
+ 以下列举两篇-->
418
+ < div class ="page-content ">
419
+ < div class ="wrapper ">
420
+ < div class ="main-left ">
421
+ < ul >
422
+ < li class ="post-list ">
423
+ < a class ="" href ="http://mp.weixin.qq.com/s?__biz=MzIxOTExOTMyOA==&mid=400401469&idx=1&sn=fcedec8a23b1c8b858651f69f614e33e&scene=18#wechat_redirect ">
424
+ < h2 class ="post-title "> 我谈新媒体 </ h2 >
425
+ </ a >
426
+ < span class ="post-meta "> 2015-11-18 静茹 太原理工新媒体中心</ span >
427
+ < div class ="post-content-preview ">
428
+ < pre >
429
+ 导语
430
+ 我谈新媒体
431
+ 我是谁
432
+ ...
433
+ </ pre >
434
+ </ div >
435
+ </ li >
436
+
437
+ < li class ="post-list ">
438
+
439
+ < a class ="post-link " href ="http://mp.weixin.qq.com/s?__biz=MzIxOTExOTMyOA==&mid=400565620&idx=1&sn=ef8e1c6fe1b55fd5a56ddcdfc9f1b8db&scene=4#wechat_redirect ">
440
+ < h2 class ="post-title ">
441
+ 致二十岁的五先生
442
+ </ h2 >
443
+
444
+ </ a >
445
+ < span class ="post-meta "> 2015-11-28 秀秀 太原理工新媒体中心</ span >
446
+ < div class ="post-content-preview ">
447
+ < pre >
448
+ 导语
449
+ 写了一个很久很久的故事。
450
+ 我想,...
451
+ </ pre >
452
+ </ div >
453
+ </ li >
454
+ < li class ="post-list ">
455
+ <!-- 省略几篇文章 -->
456
+ < a class ="post-link " href ="/ ">
457
+ < h2 class ="post-title "> 题目</ h2 >
458
+ </ a >
459
+ < span class ="post-meta "> 时间作者</ span >
460
+ < div class ="post-content-preview ">
461
+ < pre >
462
+ ...
463
+ ...
464
+ 以下省略
465
+ </ pre >
466
+ </ div >
467
+ </ li >
468
+ < li >
469
+ <!-- 省略几篇文章 -->
470
+ </ li >
471
+ </ ul >
472
+
473
+ </ div >
474
+
475
+ < div class ="main-right ">
476
+
477
+ < div class ="search ">
478
+ < input type ="text " class ="search-box " placeholder ="搜索 " /> < a href =""> < span class ="soso "> 搜索</ span > </ a >
479
+ </ div >
480
+ < div class ="search ">
481
+ < span class ="friend-link "> 友情链接</ span > < br > < br >
482
+ < a href ="http://www2015.tyut.edu.cn/ "> 太原理工大学</ a > < br >
483
+ < br >
484
+ < a href =""> 新媒体团队</ a >
485
+ < br > < br >
486
+ < a href =""> Example</ a >
487
+ </ div >
488
+ </ div >
489
+ </ div >
490
+ </ div >
491
+ < div class ="clear "> </ div >
492
+ < footer class ="site-footer ">
493
+ < div class ="footer-wrapper ">
494
+ < p > ©Newmedio logo</ p >
495
+ </ div >
496
+ </ footer >
497
+ </ body >
498
+ > > > > > > > refs/remotes/origin/hexo
187
499
</ html>
0 commit comments