YEEI 공식 드림 템플릿 멀티 프레임 공유! (데모: 이 사이트에서 N 그리드를 볼 수 있습니다)

WBOY
풀어 주다: 2016-07-25 09:13:43
원래의
1989명이 탐색했습니다.
이 홈페이지를 봤을 때 정말 멋지다고 생각했어요. 원본은 아니고 그냥 보고 모두와 공유하려고 뒤집어 봤습니다.

저작권은 YEEI에 있습니다. 프로그래머 홈 포럼은 단지 공유를 위한 것입니다!

홈페이지에서 N 그리드 렌더링을 살펴보겠습니다.



구현 방법:
1. 이미지 파일 업로드(기본 템플릿 디렉터리: /static/image/common/)
첨부 파일을 다운로드한 다음 압축을 풀고 img 폴더를 파일 디렉터리로 전송합니다(img 폴더는 폴더의 콘텐츠가 아님을 분명히 확인하세요)
2. CSS
  1. .frame{ border:none padding:0px; margin:0px}
  2. .move-span { border:none에 N 그리드 CSS 스타일을 추가하세요. ; 배경:없음; 여백:0px}
  3. .yeei_sw{padding:0;margin-top:-1px;*margin-top:-16px; border -right:1px solid #D9D9D9; border-top: 1px solid #D9D9D9;}
  4. .yeei_sw1{height:107px; Overflow:hidden;border-bottom:1px solid #D9D9D9;}
  5. .yeei_sw1l{ margin-right:320px;_margin-right:323px;padding:10px 10px 0 15px;배경:#fff url({IMGDIR}/img/show_1_bg.gif) 반복-x 0 0px;위치: 상대}
  6. .yeei_sw1l .hot{배경:url({IMGDIR}/img/new.png) 반복 없음 오른쪽 0;위치: 절대;오른쪽:0px;상단:1px 너비:48px; ; _배경:없음}
  7. .yeei_sw1l .m { margin-top:0px;*padding-right:0px}
  8. .yeei_sw1l .m img{ 테두리:1px 단색 #E0E0E0; 배경:#fff; 패딩:1px}
  9. .yeei_sw1l dt{ 글꼴 크기:16px; 패딩-상단:1px; 글꼴-가족:'히라기노 산스 GB' , 'Microsoft YaHei','宋体',Helvetica,Arial,sans-serif;}
  10. .yeei_sw1l dd{ color:#666;margin-bottom:5px}
  11. .yeei_sw1l .b { 색상:#888;}
  12. .yeei_sw1l .b a{ 색상:#77828E; 여백-오른쪽:6px}
  13. .yeei_sw1r{float:right;height:98px; _width :316px;overflow:hidden;padding-top:8px;배경:url({IMGDIR}/img/show_2_bg.gif) no-repeat 0 0;}
  14. .yeei_sw1r 차트 { 배경:없음;너비:300px; 패딩-하단:10px; 패딩-왼쪽:6px;배경: url({IMGDIR}/img/bottom_b.gif) 반복-x 0 하단;}
  15. . yeei_sw1r .yeei_wb{ padding-left:7px; padding-top:2px;}
  16. .yeei_sw1r a{cursor:pointer;}
  17. .yeei_sw1r a:hover{텍스트 장식: 없음; }
  18. .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}
  19. .yeei_wb .n { float: left; width:220px; 숨겨진 ; 배경:#FFFFF0; 테두리:1px 높이:23px; 줄 높이:23px;}
  20. .yeei_wb .n b{ 색상:#F08800; 없음 }
  21. .yeei_wb .m { float: 왼쪽; 여백:0px; 너비:54px; margin-right:7px;}
  22. .yeei_wb .m img 1px 솔리드 #85898C; 패딩:1px;}
  23. .yeei_wb 범위{float:left; margin-top:2px;margin-right:10px; 글꼴 크기:14px}
  24. .yeei_wb .ting{너비:66px;높이:19px;디스플레이: 블록;배경:url({IMGDIR}/img/wb.gif) no-repeat 0 하단; float:left}
  25. .yeei_sw2{높이: 195px ;overflow:hidden;border-bottom:1px solid #D9D9D9}
  26. .yeei_sw2l{margin-right:318px;height:195px;border-right:1px solid #D9D9D9}
  27. . yeei_sw2r { float:right;width:313px; Overflow:hidden; padding-top:5px;}
  28. .yeei_sw2l .title{배경: url({IMGDIR}/img/tab_bg. gif ) 반복-x 0 0; 높이:40px;}
  29. .yeei_sw2l .titletext{font-size:12px;font-weight:normal;}
  30. .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}
  31. .yeei_sw2l .tb-c{ 패딩:10px; 테두리: 없음}
  32. .yeei_sw2l .tb .a {배경:url({IMGDIR}/img/tab_a .gif) 반복 없음 0 0!important;font-weight: 700; color:#333;}
  33. .yeei_sw2l .module ul li{width:50%;*width:49%;border-bottom : 1px 점선 #ddd; left; margin-bottom:3px; padding:0 0px 3px 0; }
  34. .yeei_sw2l .module ul lispan({IMGDIR}/img/li. gif) 반복 없음 5px 6px; padding-left:15px;}
  35. .yeei_sw2l .module ul li em{font-size:11px; margin-right:10px;}
  36. .yeei_sw2l . ul li a:hover{color:#225F8F;text-꾸밈: 없음;}
코드 복사
3、模板中添加N格代码(默认模板文件是:/template/default/forum/discuz.htm)






  1. < p class="chart z">{lang index_today}: $todayposts|{lang index_yesterday}: $ postdata[0]|{lang index_posts}: $posts |{lang index_members}: $_G['cache']['userstats']['totalmembers']


  2. < /div>


















  • < ;/div>


  • 复aze代码 4、打开论坛首页,管理账号登陆,导入论坛XML文件!
    然后更新缓存 就可以了!

    믿을 수 없는 일이 있습니다. http://www.clqxn.com/forum.php?mod=viewthread&tid=7&extra=page=1
    还可以加小贝QQ一起交流 ,好东西就是要分享和交流的!

    추신:  다른 방법이 없고, 훨씬 더 먼 곳에도 있고, 분명하고,
       

    yeei多格.rar

    55.22KB, 다운로드 수: 1239



    원천:php.cn
    본 웹사이트의 성명
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
    인기 튜토리얼
    더>
    최신 다운로드
    더>
    웹 효과
    웹사이트 소스 코드
    웹사이트 자료
    프론트엔드 템플릿