旧版抽屉新热榜

代码如下:

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>Title</title>
  6
  7     <style>
  8         *{  9             margin: 0;
 10             padding: 0;
 11         }
 12
 13         a{ 14             text-decoration: none;
 15         }
 16
 17         body{ 18             font-family: "Times New Roman";
 19             font-size:12px;
 20         }
 21
 22 /*-----------------------head部分开始*--------------------------*/
 23
 24         .head-box{ 25             background-color: #2459a2;
 26             height: 44px;
 27             width: 100%;
 28             position: fixed;
 29             top: 0;
 30             left: 0;
 31         }
 32
 33
 34         .head-content{ 35             width: 1016px;
 36             /*background-color: ;*/
 37             height: 44px;
 38             line-height: 44px;
 39             margin: 0 auto;
 40             /*border: 1px solid red;*/
 41             position: relative;
 42         }
 43         .head-content .logo{ 44             display: inline-block;
 45             background: url("images/logo.png");
 46             width: 121px;
 47             height: 23px;
 48             float: left;
 49             margin: 11px;
 50
 51         }
 52
 53         .head-content .action-menu{ 54             float: left;
 55             margin-left: 5px;
 56         }
 57
 58         .head-content .action-menu a.tb{ 59             display: inline-block;
 60             margin-left: -3px;
 61             padding: 0 16px 0 13px;
 62             color: darkgray;
 63         }
 64
 65         .head-content .action-menu a.tb:hover{ 66             color: white;
 67             background-color: #396bb3;
 68         }
 69
 70         .head-content .action-menu a.active,.head-content .action-menu a.active:hover{ 71             color: white;
 72             background-color: #204982;
 73         }
 74
 75         .key-search{ 76             float: right;
 77             margin-top: 5px;
 78         }
 79
 80         .key-search .search-txt{ 81             float: left;
 82             width: 91px;
 83             height: 25px;
 84             padding: 2px 2px 2px 5px;
 85
 86         }
 87
 88         .key-search a{ 89             display: inline-block;
 90             width: 31px;
 91             height: 32px;
 92             background-color: #f4f4f4;
 93         }
 94
 95         .key-search a span.ico{ 96             display: inline-block;
 97             width: 11px;
 98             height: 13px;
 99             background: url("images/icon.png") no-repeat 0 -197px ;
100             /*border: 1px solid red;*/
101             margin-left: 10px;
102             margin-top: -5px;
103
104         }
105
106         .action-nav{107             position: absolute;
108             right: 150px;
109
110         }
111
112         .action-nav a{113             display: inline-block;
114             line-height: 44px;
115             color: white;
116             padding: 0 20px;
117             margin: 0 5px;
118         }
119
120         .action-nav a:hover{121             background-color: #396bb3;
122         }
123 /*-------------------head部分结束*-------------------------*/
124 /*-------------------content部分开始*-------------------------*/
125
126         .main-content-box{127             background-color: lightgrey;
128             padding-top: 44px;
129         }
130
131         .main-content{132             background-color: white;
133             margin: 0 auto;
134             width: 1016px;
135             height: auto!important;
136             min-height: 700px;
137             overflow: hidden;
138
139         }
140         .main-content .content-L{141             float: left;
142             width: 630px;
143             margin-top: 10px;
144             margin-left: 5px;
145
146         }
147
148         .content-L .top-area{149             border-bottom: 1px solid #b4b4b4;
150             height: 40px;
151
152
153         }
154
155         .top-area .child-nav{156             float: left;
157         }
158
159         .top-area .child-nav a{160             display: inline-block;
161             width: 60px;
162             height: 26px;
163             line-height: 26px;
164             color: #369;
165             text-align: center;
166
167         }
168
169         .top-area .child-nav .active{170             background: url("images/tip.png") no-repeat 0 -299px;
171             color: black;
172             font-weight: bold;
173         }
174
175
176         .sort-nav{177             float: left;
178             margin-left: 120px;
179             margin-top: 7px;
180         }
181
182         .sort-nav a {183             display: inline-block;
184             text-align: center;
185             color: #390;
186             margin-left: 10px;
187         }
188
189         .sort-nav .active{190             color: #b4b4b4;
191         }
192
193         .publish-btn{194             float: right;
195             display: inline-block;
196             width: 136px;
197             height: 32px;
198             background-color: #84a42b;
199             color: white;
200             font-size: 16px;
201             text-align: center;
202             line-height: 32px;
203         }
204
205         .content-list .item{206             border-bottom: 1px solid #b4b4b4;
207             padding-top: 10px;
208         }
209
210         .content-list .item .news-pic{211             float: right;
212         }
213
214         .content-list .item .part1{215             line-height: 20px;
216         }
217
218         .content-list .item .part1:hover .show-content{219             text-decoration: underline;
220         }
221
222         .content-list .item .part2{223             padding: 10px 0px;
224             color: #99aecb;
225         }
226
227         .part2 .hand-icon{228             background: url("images/icon_18_118.png") no-repeat 0 0;
229             /*background-position: ;*/
230             display: inline-block;
231             width: 18px;
232             height: 18px;
233         }
234
235         .part2 .icon-recommend{236             background-position: 0 -40px;
237
238
239         }
240
241         .part2 .recommend:hover .icon-recommend{242             background-position: 0 -20px;
243         }
244
245
246         .part2 .icon-discuss{247             background-position: 0 -100px;
248
249
250         }
251
252         .part2 .discuss:hover .icon-discuss{253             background-position: 0 -80px;
254         }
255
256         .part2 .icon-collect{257             background-position: 0 -160px;
258
259
260         }
261
262         .part2 .collect:hover .icon-collect{263             background-position: 0 -140px;
264         }
265
266
267         .part2 a{268             margin-left: 8px;
269         }
270
271         .part2 a b,.part2 span i{272             /*竖直间距*/
273             vertical-align: 4px;
274             font-size: 14px;
275         }
276
277         .share-site-to{278             float: right;
279         }
280
281         .share-site-to .share-icon a{282             display: inline-block ;
283             background: url("images/share_icon.png") no-repeat 0 0;
284             opacity: .3;
285         }
286
287         /*注意优先级问题*/
288         .share-icon a.icon-sina{289             background-position: 0 -90px;
290             width: 17px;
291             height: 14px;
292         }
293
294         .share-icon a.icon-douban{295             background-position: 0 -105px;
296             width: 17px;
297             height: 14px;
298         }
299
300         .share-icon a.icon-qqzone{301             background-position: 0 -120px;
302             width: 17px;
303             height: 14px;
304         }
305
306         .share-icon a.icon-renren{307             background-position: 0 -151px;
308             width: 17px;
309             height: 14px;
310         }
311
312         .share-icon a.icon-tenxun{313             background-position: 0 -136px;
314             width: 17px;
315             height: 14px;
316         }
317
318
319         .share-site-to{320             display: none;
321         }
322         .item:hover .share-site-to{323             display: inline-block;
324
325         }
326
327         .share-site-to .share-icon a:hover{328             opacity: 1;
329         }
330
331         .page-area ul li{332             display: inline-block;
333         }
334
335         .page-area ul li a{336             display: inline-block;
337             width: 34px;
338             height: 34px;
339             color: #369;
340             line-height: 34px;
341             text-align: center;
342             border: 1px solid #e1e1e1;
343             border-radius: 15%;
344             margin-left: 5px;
345         }
346
347         .page-area ul li a.page-next{348             width: 90px;
349         }
350
351         .page-area ul li a:hover{352             background-color: #369;
353             color: white;
354         }
355
356         .page-area{357             margin-left: 40px;
358             /*margin: 0 auto;*/
359         }
360
361
362         .main-content .content-R{363             float: left;
364         }
365
366         .footer-box{367             clear: both;
368             margin: 0 auto;
369             width: 960px;
370             background-color: #fff;
371             border-top: 1px solid #dce7f4;
372         }
373
374         .footer-box .foot-nav{375             padding-top: 15px;
376             text-align: center;
377             border-top: 1px solid #ccdcef;
378         }
379
380         .footer-box .foot-nav2{381             padding-top: 6px;
382             margin-bottom: 15px;
383             text-align: center;
384         }
385
386         .foot_b{387             color: #999;
388             font-size: 12px;
389         }
390
391
392     </style>
393 </head>
394 <body>
395
396
397 <div class="head-box">
398
399     <div class="head-content">
400
401         <a href="#" class="logo"></a>
402
403         <div class="action-menu">
404
405                     <a href="#" class="tb active">全部</a>
406                     <a href="#" class="tb">42区</a>
407                     <a href="#" class="tb">段子</a>
408                     <a href="#" class="tb">图片</a>
409                     <a href="#" class="tb">挨踢1024</a>
410                     <a href="#" class="tb">你问我答</a>
411
412         </div>
413
414         <div class="key-search">
415
416                 <form action="/" method="post">
417
418                     <input type="text" class="search-txt">
419
420                     <a href="#" class="i" >
421                         <span class="ico"></span>
422                     </a>
423
424                 </form>
425
426         </div>
427
428         <div class="action-nav">
429                 <a href="#" class="register-btn">注册</a>
430                 <a href="#" class="login-btn">登录</a>
431         </div>
432
433     </div>
434 </div>
435
436 <div class="main-content-box">
437
438     <div class="main-content">
439
440         <div class="content-L">
441
442             <div class="top-area">
443
444                 <div class="child-nav">
445
446                     <a href="#"  class="hotbtn active" >最热</a>
447                     <a href="#"  class="newbtn"    >最新</a>
448                     <a href="#"  class="personbtn" >人类发布</a>
449
450                 </div>
451
452                 <div class="sort-nav">
453                     <a href="#"  class="sortbtn active" >即时排序</a>
454                     <a href="#"  class="newbtn" >24小时</a>
455                     <a href="#"  class="newbtn" >3天</a>
456                 </div>
457
458                 <a href="#" class="publish-btn">
459                     <span class="n2">+ &nbsp;&nbsp;发布</span>
460                 </a>
461
462             </div>
463
464             <div class="content-list">
465
466
467                   <div class="item">
468
469                             <div class="news-pic">
470                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
471                             </div>
472
473                             <div class="news-content">
474                                 <div class="part1">
475                                         <a href="#" class="show-content" target="_blank">
476                                                 @伊涅斯科:梅西接受每体采访完整版,非常长,没想到他话这么少的人还能说这么多,
477                                             谈到了自己的伤病问题,谈了上个赛季欧冠的失败,谈到了今夏的新援,谈了内马尔签约的问题,
478                                             谈到了自己离队的传闻,谈了自己的感情,谈了和C罗的饭局,说了很多很多,采访者问的问题基本都回了,
479                                             感觉这个赛季他都不会再说什么话了…
480                                         </a>
481
482                                         <span class="content-source">-ww4.sinaimg.cn</span>
483                                         <a href="#" class="n2">
484                                             <span class="content-kind">42区</span>
485                                         </a>
486                                 </div>
487
488                                 <div class="part2">
489
490
491                                         <a href="#" class="recommend" title="推荐">
492                                             <span class="hand-icon icon-recommend"></span>
493                                             <b>4</b>
494                                         </a>
495
496
497                                         <a href="javascript:;" class="discuss">
498                                             <span class="hand-icon icon-discuss"></span>
499                                             <b>5</b>
500                                         </a>
501
502
503                                         <a href="javascript:;" class="collect" title="加入私藏">
504                                             <span class="hand-icon icon-collect"></span>
505                                             <b>私藏</b>
506                                         </a>
507
508
509                                         <a href="#" class="user-a">
510                                             <span>
511                                                 <img src="data:images/13.png">
512                                             </span>
513                                             <b>乱太郎</b>
514                                         </a>
515
516                                     <span class="left time-into">
517                                         <a class="time-a" href="#" target="_blank">
518                                             <b>4分钟前</b>
519                                         </a>
520                                         <i>入热榜</i>
521                                     </span>
522
523                                     <span class="share-site-to">
524                                         <i>分享到</i>
525                                         <span class="share-icon">
526                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
527                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
528                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
529                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
530                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
531
532                                         </span>
533                                     </span>
534
535                                 </div>
536                             </div>
537
538                   </div>
539                   <div class="item">
540
541                             <div class="news-pic">
542                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
543                             </div>
544
545                             <div class="news-content">
546                                 <div class="part1">
547                                         <a href="#" class="show-content" target="_blank">
548                                                 【剑桥哥大两研究生欲造登月电梯:称32万公里电缆只需10亿美元】8月25日两位
549                                             剑桥、哥大天文学研究生在arXiv上发表研究称,“月球太空电梯”在技术上和经济上
550                                             具备可行性,只需大约10亿美元成本。研究称,建造月球空间电梯会比运用火箭技术更
551                                             经济,能够将原材料从月球矿山带回地球。
552                                         </a>
553
554                                         <span class="content-source">-ww4.sinaimg.cn</span>
555                                         <a href="#" class="n2">
556                                             <span class="content-kind">42区</span>
557                                         </a>
558                                 </div>
559
560                                 <div class="part2">
561
562
563                                         <a href="#" class="recommend" title="推荐">
564                                             <span class="hand-icon icon-recommend"></span>
565                                             <b>4</b>
566                                         </a>
567
568
569                                         <a href="javascript:;" class="discuss">
570                                             <span class="hand-icon icon-discuss"></span>
571                                             <b>5</b>
572                                         </a>
573
574
575                                         <a href="javascript:;" class="collect" title="加入私藏">
576                                             <span class="hand-icon icon-collect"></span>
577                                             <b>私藏</b>
578                                         </a>
579
580
581                                         <a href="#" class="user-a">
582                                             <span>
583                                                 <img src="data:images/13.png">
584                                             </span>
585                                             <b>乱太郎</b>
586                                         </a>
587
588                                     <span class="left time-into">
589                                         <a class="time-a" href="#" target="_blank">
590                                             <b>4分钟前</b>
591                                         </a>
592                                         <i>入热榜</i>
593                                     </span>
594                                     <!-- 分享各微博的按钮 -->
595
596                                     <span class="share-site-to">
597                                         <i>分享到</i>
598                                         <span class="share-icon">
599                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
600                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
601                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
602                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
603                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
604                                             <a class="share-none"> </a>
605
606                                         </span>
607                                     </span>
608
609                                 </div>
610                             </div>
611
612                   </div>
613                   <div class="item">
614
615                             <div class="news-pic">
616                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
617                             </div>
618
619                             <div class="news-content">
620                                 <div class="part1">
621                                         <a href="#" class="show-content" target="_blank">
622                                                 【《轮到你了》的正确打开方式】从某个角度看,这是一部描写“邻人有病”的搞
623                                             笑剧,也是一部符合次时代观念的“爱情剧”。对于这样的电视剧,当作喜剧来看,或
624                                             当成动漫改编剧来看就好了,何必那么较真凶手是否可能呢?
625                                         </a>
626
627                                         <span class="content-source">-ww4.sinaimg.cn</span>
628                                         <a href="#" class="n2">
629                                             <span class="content-kind">42区</span>
630                                         </a>
631                                 </div>
632
633                                 <div class="part2">
634
635
636                                         <a href="#" class="recommend" title="推荐">
637                                             <span class="hand-icon icon-recommend"></span>
638                                             <b>4</b>
639                                         </a>
640
641
642                                         <a href="javascript:;" class="discuss">
643                                             <span class="hand-icon icon-discuss"></span>
644                                             <b>5</b>
645                                         </a>
646
647
648                                         <a href="javascript:;" class="collect" title="加入私藏">
649                                             <span class="hand-icon icon-collect"></span>
650                                             <b>私藏</b>
651                                         </a>
652
653
654                                         <a href="#" class="user-a">
655                                             <span>
656                                                 <img src="data:images/13.png">
657                                             </span>
658                                             <b>乱太郎</b>
659                                         </a>
660
661                                     <span class="left time-into">
662                                         <a class="time-a" href="#" target="_blank">
663                                             <b>4分钟前</b>
664                                         </a>
665                                         <i>入热榜</i>
666                                     </span>
667                                     <!-- 分享各微博的按钮 -->
668
669                                     <span class="share-site-to">
670                                         <i>分享到</i>
671                                         <span class="share-icon">
672                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
673                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
674                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
675                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
676                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
677                                             <a class="share-none"> </a>
678
679                                         </span>
680                                     </span>
681
682                                 </div>
683                             </div>
684
685                   </div>
686                   <div class="item">
687
688                             <div class="news-pic">
689                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
690                             </div>
691
692                             <div class="news-content">
693                                 <div class="part1">
694                                         <a href="#" class="show-content" target="_blank">
695                                                 【美国版饿了么将上市,在美点外卖是种什么体验?】美国外卖市场被几家巨头瓜
696                                             分,各家市场份额在地区上有明显差异。GrubHub在东北区最受欢迎,而DoorDash在德州
697                                             遥遥领先,后起之秀Postmates则在洛杉矶占据了40%的市场,将于9月谋求上市,他同时
698                                             获得了机器人上路送餐的许可,将在LA进行测试。
699                                         </a>
700
701                                         <span class="content-source">-ww4.sinaimg.cn</span>
702                                         <a href="#" class="n2">
703                                             <span class="content-kind">42区</span>
704                                         </a>
705                                 </div>
706
707                                 <div class="part2">
708
709
710                                         <a href="#" class="recommend" title="推荐">
711                                             <span class="hand-icon icon-recommend"></span>
712                                             <b>4</b>
713                                         </a>
714
715
716                                         <a href="javascript:;" class="discuss">
717                                             <span class="hand-icon icon-discuss"></span>
718                                             <b>5</b>
719                                         </a>
720
721
722                                         <a href="javascript:;" class="collect" title="加入私藏">
723                                             <span class="hand-icon icon-collect"></span>
724                                             <b>私藏</b>
725                                         </a>
726
727
728                                         <a href="#" class="user-a">
729                                             <span>
730                                                 <img src="data:images/13.png">
731                                             </span>
732                                             <b>乱太郎</b>
733                                         </a>
734
735                                     <span class="left time-into">
736                                         <a class="time-a" href="#" target="_blank">
737                                             <b>4分钟前</b>
738                                         </a>
739                                         <i>入热榜</i>
740                                     </span>
741                                     <!-- 分享各微博的按钮 -->
742
743                                     <span class="share-site-to">
744                                         <i>分享到</i>
745                                         <span class="share-icon">
746                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
747                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
748                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
749                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
750                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
751                                             <a class="share-none"> </a>
752
753                                         </span>
754                                     </span>
755
756                                 </div>
757                             </div>
758
759                   </div>
760                   <div class="item">
761
762                             <div class="news-pic">
763                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
764                             </div>
765
766                             <div class="news-content">
767                                 <div class="part1">
768                                         <a href="#" class="show-content" target="_blank">
769                                                 【不要再盲目“唱衰”服饰行业了】李宁的“时尚之心”已是众人皆知,但目前李
770                                             宁在研发上的支出非常微薄,研发费用占营收比重维持在2%的水平。而安踏这一块的投
771                                             入近几年却保持在5%以上,耐克更是达到9%。
772                                         </a>
773
774                                         <span class="content-source">-ww4.sinaimg.cn</span>
775                                         <a href="#" class="n2">
776                                             <span class="content-kind">42区</span>
777                                         </a>
778                                 </div>
779
780                                 <div class="part2">
781
782
783                                         <a href="#" class="recommend" title="推荐">
784                                             <span class="hand-icon icon-recommend"></span>
785                                             <b>4</b>
786                                         </a>
787
788
789                                         <a href="javascript:;" class="discuss">
790                                             <span class="hand-icon icon-discuss"></span>
791                                             <b>5</b>
792                                         </a>
793
794
795                                         <a href="javascript:;" class="collect" title="加入私藏">
796                                             <span class="hand-icon icon-collect"></span>
797                                             <b>私藏</b>
798                                         </a>
799
800
801                                         <a href="#" class="user-a">
802                                             <span>
803                                                 <img src="data:images/13.png">
804                                             </span>
805                                             <b>乱太郎</b>
806                                         </a>
807
808                                     <span class="left time-into">
809                                         <a class="time-a" href="#" target="_blank">
810                                             <b>4分钟前</b>
811                                         </a>
812                                         <i>入热榜</i>
813                                     </span>
814                                     <!-- 分享各微博的按钮 -->
815
816                                     <span class="share-site-to">
817                                         <i>分享到</i>
818                                         <span class="share-icon">
819                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
820                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
821                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
822                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
823                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
824                                             <a class="share-none"> </a>
825
826                                         </span>
827                                     </span>
828
829                                 </div>
830                             </div>
831
832                   </div>
833                   <div class="item">
834
835                             <div class="news-pic">
836                                 <img src="data:images/news.jpg" alt="抽屉新热榜">
837                             </div>
838
839                             <div class="news-content">
840                                 <div class="part1">
841                                         <a href="#" class="show-content" target="_blank">
842                                                 【沙特产油量可能减半,美国称必要时将动用紧急原油储备】事件发生后,沙特关
843                                             停了该国一半的石油生产。沙特阿美方面表示,这将影响每日近570万桶原油的产量,
844                                             约占到全球原油日产量的5%。由于全球市场周末休市,油价没有立即受到影响。但CNBC
845                                             新闻网分析称,最坏情况下,全球油价会因此上涨10美元/桶。
846                                         </a>
847
848                                         <span class="content-source">-ww4.sinaimg.cn</span>
849                                         <a href="#" class="n2">
850                                             <span class="content-kind">42区</span>
851                                         </a>
852                                 </div>
853
854                                 <div class="part2">
855
856
857                                         <a href="#" class="recommend" title="推荐">
858                                             <span class="hand-icon icon-recommend"></span>
859                                             <b>4</b>
860                                         </a>
861
862
863                                         <a href="javascript:;" class="discuss">
864                                             <span class="hand-icon icon-discuss"></span>
865                                             <b>5</b>
866                                         </a>
867
868
869                                         <a href="javascript:;" class="collect" title="加入私藏">
870                                             <span class="hand-icon icon-collect"></span>
871                                             <b>私藏</b>
872                                         </a>
873
874
875                                         <a href="#" class="user-a">
876                                             <span>
877                                                 <img src="data:images/13.png">
878                                             </span>
879                                             <b>乱太郎</b>
880                                         </a>
881
882                                     <span class="left time-into">
883                                         <a class="time-a" href="#" target="_blank">
884                                             <b>4分钟前</b>
885                                         </a>
886                                         <i>入热榜</i>
887                                     </span>
888                                     <!-- 分享各微博的按钮 -->
889
890                                     <span class="share-site-to">
891                                         <i>分享到</i>
892                                         <span class="share-icon">
893                                             <a class="icon-sina"    title="分享到新浪微博" href="#" ></a>
894                                             <a class="icon-douban"  title="分享到豆瓣"    href="#" ></a>
895                                             <a class="icon-qqzone"  title="分享到QQ空间"  href="#" ></a>
896                                             <a class="icon-tenxun"  title="分享到腾讯微博" href="#" ></a>
897                                             <a class="icon-renren"  title="分享到人人网"   href="#" ></a>
898                                             <a class="share-none"> </a>
899
900                                         </span>
901                                     </span>
902
903                                 </div>
904                             </div>
905
906                   </div>
907
908             </div>
909
910             <div class="page-area">
911                  <ul>
912                      <li><span class="current_page">1</span></li>
913                      <li><a href="#" class="page-a">2</a></li>
914                      <li><a href="#" class="page-a">3</a></li>
915                      <li><a href="#" class="page-a">4</a></li>
916                      <li><a href="#" class="page-a">5</a></li>
917                      <li><a href="#" class="page-a">6</a></li>
918                      <li><a href="#" class="page-a">7</a></li>
919                      <li><a href="#" class="page-a">8</a></li>
920                      <li><a href="#" class="page-a">9</a></li>
921                      <li><a href="#" class="page-a">10</a></li>
922                      <li><a href="#" class="page-a page-next">下一页</a></li>
923                  </ul>
924             </div>
925
926         </div>
927
928         <div class="content-R"></div>
929
930         <div class="footer-box">
931         <div class="foot-nav">
932             <a href="#" target="_blank">关于我们</a>
933             <span>|</span>
934             <a href="#" target="_blank">联系我们</a>
935             <span>|</span>
936             <a href="#" target="_blank">服务条款</a>
937             <span>|</span>
938             <a href="#" target="_blank">隐私政策</a>
939             <span>|</span>
940             <a href="#" target="_blank">抽屉新热榜工具</a>
941             <span>|</span>
942             <a href="#" target="_blank">下载客户端</a>
943             <span>|</span>
944             <a href="#" target="_blank">意见与反馈</a>
945             <span>|</span>
946             <a href="#" target="_blank">友情链接</a>
947             <span>|</span>
948             <a href="#" target="_blank">公告</a>
949         <a href="#"  style="margin-left:0;vertical-align:-2px;">
950             <img src="data:images/ct_rss.gif" width="36" height="14">
951         </a>
952         </div>
953
954         <div class="foot-nav2">
955             <a target="_blank" href="#">
956                 <img class="foot_e" src="data:images/footer1.gif" width="36" height="14">
957             </a>
958             <span class="foot_d">旗下站点</span>
959             <span class="foot_a">©2016chouti.com</span>
960             <a target="_blank" href="#" class="foot_b">京ICP备09053974号-3 京公网安备 110102004562</a>
961             <div style="margin-top:6px;">版权所有:北京格致璞科技有限公司</div>
962
963         </div>
964     </div>
965
966     </div>
967
968 </div>
969
970
971 </body>
972 </html>

页面展示:

转载于:https://www.cnblogs.com/hackerer/p/11524249.html

Python之路【第二十篇】:python项目之旧版抽屉新热榜相关推荐

  1. Python之路(第二十篇) subprocess模块

    一.subprocess模块 subprocess英文意思:子进程 那什么是进程呢? (一)关于进程的相关理论基础知识 进程是对正在运行程序的一个抽象,进程的概念起源于操作系统,是操作系统最核心的概念 ...

  2. 原创:《Python之路实战40篇》PDF高清版,限时下载!

    内容简介 1 <Python之路40篇实战 .pdf>包含Python篇.数据分析篇.机器学习篇等 3 大模块,目录如下: 下载方式 2 关注公众号「Python与算法社区」,后台回复一个 ...

  3. Python之路(第二十一篇) re模块

    一.re模块 正则表达式本身是一种小型的.高度专业化的编程语言,正则表达式就是字符串的匹配规则,在多数编程语言里都有相应的支持,python里对应的模块是re,正则表达式模式被编译成一系列的字节码,然 ...

  4. Python之路(第二十三篇) 面向对象初级:静态属性、静态方法、类方法

    一.静态属性 静态属性相当于数据属性. 用@property语法糖装饰器将类的函数属性变成可以不用加括号直接的类似数据属性. 可以封装逻辑,让用户感觉是在调用一个普通的数据属性. 例子 class R ...

  5. Python之路(第二十七篇) 面向对象进阶:内置方法、描述符

    一.__call__ 对象后面加括号,触发执行类下面的__call__方法. 创建对象时,对象 = 类名() :而对于 __call__ 方法的执行是由对象后加括号触发的,即:对象() 或者 类()( ...

  6. Python之路【第一篇】:Python简介和入门

    Python之路[第一篇]:Python简介和入门 Python简介 Python前世今生 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗 ...

  7. Python学习笔记第二十九天(N维数组(ndarray))

    Python学习笔记第二十九天 N维数组(ndarray) 构建阵列 索引阵列 ndarray的内部内存布局 阵列属性 内存布局 数据类型 其他属性 阵列接口 ctypes外部功能接口 Array方法 ...

  8. python学习的第二十五天:对PDF文件的读写操作

    文章目录 python学习的第二十五天:对PDF文件的读写操作 对Excel操作的补充 python的实用方法 获取指定文件下的所有内容 shutil模块(封装了高级的文件操作函数) PDF的相关操作 ...

  9. LinuxGUI自动化测试框架搭建(二十一)-截止第二十篇,如果出现以下错误,请修改代码+截止目前的全局配置文件config.py内容

    (二十一)-截止第二十篇,如果出现以下错误,请修改代码 1 错误类型 2 原因分析 3 解决方法 4 修改common/screenShot.py 5 修改config/config.py 1 错误类 ...

  10. Python之路(第十六篇)xml模块、datetime模块

    一.xml模块 xml是实现不同语言或程序之间进行数据交换的协议,跟json差不多,但json使用起来更简单, xml比较早,早期许多软件都是用xml,至今很多传统公司如金融行业的很多系统的接口还主要 ...

最新文章

  1. shell中符号使用
  2. 安卓能帮你检查密码泄露了!还有Messages定时发送等多项功能优化
  3. 用python画花瓣-Python竟能画这么漂亮的花,帅呆了(代码分享)
  4. File Explore 中data权限修改,实体机
  5. 白话Elasticsearch29-IK中文分词之IK分词器配置文件+自定义词库
  6. Tomcat集群和Session共享的配置方法
  7. RHEL/CentOS 6.x使用EPEL6与remi的yum源安装MySQL 5.5.x
  8. ORA-07445 ERROR on auto execute of job 8913
  9. 【Hadoop】HDFS笔记(三):HDFS的Shell操作
  10. 关于Patter类和Match类
  11. [转载]强大的grep用法详解:grep与正则表达式
  12. python创建一个csv文件_Python程序中用csv模块来操作csv文件的基本使用教程
  13. 小智双核浏览器下载安装配置教程
  14. 计算机网络考研408计算机134分笔记!超级详细!23最新考纲
  15. Accessorize to a Crime: Real and Stealthy Attacks on State-of-the-Art Face Recognition
  16. 安装postgres10 后,使用自带的pgAdmin 4 访问数据库,出现The pgAdmin 4 server could not be contacted错误的最完美解决方案,另附安装步骤。
  17. 验证手机号码是否正确
  18. 【短链接】——新浪、百度、搜狐等官方长链接转短链接
  19. 大数据开发教程——构建Hadoop开发环境
  20. Chromium源码—base基础库说明

热门文章

  1. STM32 Flash读写;Flash地址对应的存储内容及方式;
  2. 读 Robert C. Solomon 之 《世界哲学简史》
  3. postgresql下载linux版本
  4. 程序员裸辞2个月找不到工作,心态爆炸了
  5. win7怎样设置计算机休眠时间,win7休眠时间怎么设置
  6. uniapp实现点击回到顶部
  7. web前端经典面试题
  8. 删除/卸载干净红蜘蛛的.exe和.dll文件
  9. 免费中通快递对接快递鸟单号查询接口对接方法
  10. linux学习第二周总结