You are not connected. Please login or register

Index_box chia 2 cột tự động

Go down  Thông điệp [Trang 1 trong tổng số 1 trang]

SuperMan

SuperMan
»Admin
»Admin

*Giới thiệu
Trước mắt mình chia sẻ các bạn mẫu index_box mình tạo trước. Sau này nếu có điều kiện sẽ hướng dẫn các bạn chỉnh ngay trên forum các bạn Index_box chia 2 cột tự động 364988687

*Demo
[You must be registered and logged in to see this link.]

*Index_box


Code:
<div class="pun-crumbs">
   <p class="crumbs"><a href="{U_INDEX}">{L_INDEX}</a><strong>{NAV_CAT_DESC}</strong></p>
</div>
<div class="main">
<!-- BEGIN catrow -->
   <!-- BEGIN tablehead -->
      <div class="main-head">
         <div class="page-title">{catrow.tablehead.L_FORUM}</div>
      </div>
      <div class="main-content">
         <table cellspacing="0" class="table">
            <tbody class="statused">
               <tr>
                  <td>
   <!-- END tablehead -->

   <!-- BEGIN forumrow -->
                     <div class="box">
                     <h{catrow.forumrow.LEVEL} class="hierarchy"><a href="{catrow.forumrow.U_VIEWFORUM}"class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></h{catrow.forumrow.LEVEL}>
                     <br />
                     <div class="box1">{catrow.forumrow.FORUM_DESC}</div>
                     <div class="box2">
                        <!-- BEGIN switch_topic_title -->
                        <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                        <!-- END switch_topic_title -->
                        {catrow.forumrow.USER_LAST_POST}
                     </div>
                     <center><div class="box3"><strong>{catrow.forumrow.TOPICS}</strong> chủ đề | <strong>{catrow.forumrow.POSTS}</strong> số bài</div></center>
                     {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                     <strong>{forumrow.L_SUBFORUM_STR}</strong> {forumrow.SUBFORUMS}
                     </div>
   <!-- END forumrow -->

   <!-- BEGIN tablefoot -->
                  </td>
               </tr>
            </tbody>
         </table>
      </div>
   <!-- END tablefoot -->
<!-- END catrow -->
</div>

<!-- BEGIN switch_on_index -->
<div class="main-box clearfix">
   <ul>
      <li><a href="{U_TODAY_ACTIVE}">Chủ đề hôm nay</a></li>
      <li><a href="{U_TODAY_POSTERS}">Tích cực hôm nay</a></li>
      <li><a href="{U_OVERALL_POSTERS}">Thành viên tích cực</a></li>
   </ul>
   <!-- BEGIN switch_delete_cookies -->
   <p class="right">
      <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}">Xóa Cookies</a>
   </p>
   <!-- END switch_delete_cookies -->
</div>
<!-- END switch_on_index -->



*CSS


Code:
.box{width:47%;float:left;border:2px solid #7D2252;border-top:4px solid #7D2252;margin:5px;padding:2px}
a.forumtitle{background:#7D2252;padding:1px 15px 1px 5px;border-radius:0 0 10px 0}
.box1{width:64px;max-height:64px;float:right}
.box2{margin-left:10px}
.box3{background:#7D2252;color:#FFF;padding:4px;margin-bottom:0}



*Hiệu ứng phụ
Làm nổi bật tên box cần thiết (Demo: Box "Nhật kí lớp" hình trên)
Chèn code sau vào CSS thay bằng link box cần làm nổi bật
Code:
a[href="/f14-forum"].forumtitle{background:#F6358A;color:#FFF}


*Lưu ý
-Index_box này không có phần mô tả vì phần mô tả được dùng để chứa biểu tượng cho box. Chèn code sau vào phần mô tả để tạo icon box
Code:
<img src="link ảnh" />

-Index_box này không có phần Status của box. Tức là không có những cái như thế này 
Index_box chia 2 cột tự động Cp11510

Viết bởi handsomevip007 - FMvi Designer

Về Đầu Trang  Thông điệp [Trang 1 trong tổng số 1 trang]

Permissions in this forum:
Bạn không có quyền trả lời bài viết