이 홈페이지를 봤을 때 정말 멋지다고 생각했어요. 원본은 아니고 그냥 보고 모두와 공유하려고 뒤집어 봤습니다.
저작권은 YEEI에 있습니다. 프로그래머 홈 포럼은 단지 공유를 위한 것입니다!
홈페이지에서 N 그리드 렌더링을 살펴보겠습니다.
구현 방법:
1. 이미지 파일 업로드(기본 템플릿 디렉터리: /static/image/common/)
첨부 파일을 다운로드한 다음 압축을 풀고 img 폴더를 파일 디렉터리로 전송합니다(img 폴더는 폴더의 콘텐츠가 아님을 분명히 확인하세요)
2. CSS
- .frame{ border:none padding:0px; margin:0px}
- .move-span { border:none에 N 그리드 CSS 스타일을 추가하세요. ; 배경:없음; 여백:0px}
- .yeei_sw{padding:0;margin-top:-1px;*margin-top:-16px; border -right:1px solid #D9D9D9; border-top: 1px solid #D9D9D9;}
- .yeei_sw1{height:107px; Overflow:hidden;border-bottom:1px solid #D9D9D9;}
- .yeei_sw1l{ margin-right:320px;_margin-right:323px;padding:10px 10px 0 15px;배경:#fff url({IMGDIR}/img/show_1_bg.gif) 반복-x 0 0px;위치: 상대}
- .yeei_sw1l .hot{배경:url({IMGDIR}/img/new.png) 반복 없음 오른쪽 0;위치: 절대;오른쪽:0px;상단:1px 너비:48px; ; _배경:없음}
- .yeei_sw1l .m { margin-top:0px;*padding-right:0px}
- .yeei_sw1l .m img{ 테두리:1px 단색 #E0E0E0; 배경:#fff; 패딩:1px}
- .yeei_sw1l dt{ 글꼴 크기:16px; 패딩-상단:1px; 글꼴-가족:'히라기노 산스 GB' , 'Microsoft YaHei','宋体',Helvetica,Arial,sans-serif;}
- .yeei_sw1l dd{ color:#666;margin-bottom:5px}
- .yeei_sw1l .b { 색상:#888;}
- .yeei_sw1l .b a{ 색상:#77828E; 여백-오른쪽:6px}
- .yeei_sw1r{float:right;height:98px; _width :316px;overflow:hidden;padding-top:8px;배경:url({IMGDIR}/img/show_2_bg.gif) no-repeat 0 0;}
- .yeei_sw1r 차트 { 배경:없음;너비:300px; 패딩-하단:10px; 패딩-왼쪽:6px;배경: url({IMGDIR}/img/bottom_b.gif) 반복-x 0 하단;}
- . yeei_sw1r .yeei_wb{ padding-left:7px; padding-top:2px;}
- .yeei_sw1r a{cursor:pointer;}
- .yeei_sw1r a:hover{텍스트 장식: 없음; }
- .yeei_wb dt { 높이:19px;overflow:hidden;padding-bottom:9px;font-family:'宋体',Helvetica,Arial,sans-serif; 글꼴-가중치: 700; ({IMGDIR}/img/wb.gif) no-repeat -54px 4px; padding-left:17px}
- .yeei_wb .n { float: left; width:220px; 숨겨진 ; 배경:#FFFFF0; 테두리:1px 높이:23px; 줄 높이:23px;}
- .yeei_wb .n b{ 색상:#F08800; 없음 }
- .yeei_wb .m { float: 왼쪽; 여백:0px; 너비:54px; margin-right:7px;}
- .yeei_wb .m img 1px 솔리드 #85898C; 패딩:1px;}
- .yeei_wb 범위{float:left; margin-top:2px;margin-right:10px; 글꼴 크기:14px}
- .yeei_wb .ting{너비:66px;높이:19px;디스플레이: 블록;배경:url({IMGDIR}/img/wb.gif) no-repeat 0 하단; float:left}
- .yeei_sw2{높이: 195px ;overflow:hidden;border-bottom:1px solid #D9D9D9}
- .yeei_sw2l{margin-right:318px;height:195px;border-right:1px solid #D9D9D9}
- . yeei_sw2r { float:right;width:313px; Overflow:hidden; padding-top:5px;}
- .yeei_sw2l .title{배경: url({IMGDIR}/img/tab_bg. gif ) 반복-x 0 0; 높이:40px;}
- .yeei_sw2l .titletext{font-size:12px;font-weight:normal;}
- .yeei_sw2l .tb a{padding : 0px; 배경: url({IMGDIR}/img/tab_a.gif) 반복 없음 0 -40px!important; margin-right:5px; border:none;text-align:center;width:85px ; 높이:40px}
- .yeei_sw2l .tb-c{ 패딩:10px; 테두리: 없음}
- .yeei_sw2l .tb .a {배경:url({IMGDIR}/img/tab_a .gif) 반복 없음 0 0!important;font-weight: 700; color:#333;}
- .yeei_sw2l .module ul li{width:50%;*width:49%;border-bottom : 1px 점선 #ddd; left; margin-bottom:3px; padding:0 0px 3px 0; }
- .yeei_sw2l .module ul lispan({IMGDIR}/img/li. gif) 반복 없음 5px 6px; padding-left:15px;}
- .yeei_sw2l .module ul li em{font-size:11px; margin-right:10px;}
- .yeei_sw2l . ul li a:hover{color:#225F8F;text-꾸밈: 없음;}
코드 복사
3、模板中添加N格代码(默认模板文件是:/template/default/forum/discuz.htm)
- < p class="chart z">{lang index_today}: $todayposts|{lang index_yesterday}: $ postdata[0]|{lang index_posts}: $posts |{lang index_members}: $_G['cache']['userstats']['totalmembers']
- < /div>
复aze代码
4、打开论坛首页,管理账号登陆,导入论坛XML文件!
然后更新缓存 就可以了!
믿을 수 없는 일이 있습니다. http://www.clqxn.com/forum.php?mod=viewthread&tid=7&extra=page=1
还可以加小贝QQ一起交流 ,好东西就是要分享和交流的!
추신: 다른 방법이 없고, 훨씬 더 먼 곳에도 있고, 분명하고,
|