浠婂ぉ锛屾€荤畻鏄井淇¤兘鐧诲綍璺宠浆鍒皃c绔綉椤典簡锛屽垎浜竴涓嬶紝杩欏嚑澶╃殑鎶樿吘锛屼笅闈㈡槸涓婂崍鎶樿吘鍑烘潵鐨勩€

浣跨敤 Trae瑙ｅ喅瀵艰棣栭〉鍚勫唴瀹瑰尯鍩熺殑灞曠ず闂銆傚疄鐜版爣棰橀泦涓湪涓€琛屾樉绀恒€傞粯璁ゆ槸灞曞紑锛屼竴涓爣棰樺尯涓€涓爣棰樺尯銆
Trae 瑙ｅ喅浜嗭細

- 1.鎵€鏈夋爣棰樺湪涓€琛屾按骞虫樉绀猴紝鏀寔婊氬姩銆
- 2.榧犳爣鍒掑姩鍒版爣棰樹笂鏃讹紝鏄剧ず瀵瑰簲鏍囬涓嬬殑鍐呭銆
- 3.涓烘爣棰樿缃簡瀹藉害涓嶈秴杩21%鐨勯檺鍒躲€
- 4.娣诲姞浜嗘寚瀹氱殑娓愬彉鑳屾櫙鑹插拰鍦嗚鏁堟灉銆
- 5.娣诲姞浜嗙櫧鑹1px杈规銆
- 6.涓"鏇村"閾炬帴璁剧疆浜嗚緝灏忕殑瀛椾綋鍜岃緝娴呯殑棰滆壊銆
  
涓嬮潰鍒嗕韩鍘熷浠ｇ爜锛

<!--{if $view == 'index'}-->        <style type="text/css">                .guide-tabs-container {                        display: flex;                        overflow-x: auto;                        white-space: nowrap;                        margin-bottom: 15px;                        padding: 5px;                }                .guide-tab {                        flex: 0 0 auto;                        width: 21%; /* 瀹藉害涓嶈秴杩21% */                        min-width: 150px; /* 鏈€灏忓搴︼紝纭繚鍐呭涓嶄細琚帇缂╁緱澶皬 */                        padding: 10px 20px;                        cursor: pointer;                        position: relative;                        background: linear-gradient(132deg,rgba(235,237,240,0.85) 9.65%,rgba(233,236,238,0.5) 58.96%,rgba(254,254,255,0.87) 86.15%);                        border-radius: 5px;                        border: 1px solid white;                        margin-right: 10px;                        transition: all 0.3s ease;                        display: flex;                        justify-content: space-between;                        align-items: center;                }                .guide-tab:hover {                        box-shadow: 0 2px 5px rgba(0,0,0,0.1);                }                .guide-tab.active {                        background: linear-gradient(132deg,rgba(220,225,230,0.85) 9.65%,rgba(215,220,225,0.5) 58.96%,rgba(240,245,250,0.87) 86.15%);                        font-weight: bold;                }                .guide-content {                        display: none;                        padding: 15px 0;                }                .guide-content.active {                        display: block;                }                /* 鏇村閾炬帴鏍峰紡 */                .guide-tab .more-link {                        font-size: 12px; /* 瀛椾綋灏忎竴鐐 */                        color: #888; /* 棰滆壊姣斾富鏍囬娴 */                        text-decoration: none;                }                .guide-tab .more-link:hover {                        color: #555;                        text-decoration: underline;                }                /* 闅愯棌婊氬姩鏉′絾淇濈暀鍔熻兘 */                .guide-tabs-container::-webkit-scrollbar {                        display: none;                }                .guide-tabs-container {                        -ms-overflow-style: none;                        scrollbar-width: none;                }        </style>        <div class="guide-tabs-container">                <!--{loop $data $key $list}-->                <div class="guide-tab" data-target="tab-$key">                        <span>                                <!--{if $key == 'hot'}-->{lang guide_hot}<!--{elseif $key == 'digest'}-->{lang guide_digest}<!--{elseif $key == 'newthread'}-->{lang guide_newthread}<!--{elseif $key == 'new'}-->{lang guide_new}<!--{elseif $key == 'my'}-->{lang guide_my}<!--{/if}-->                        </span>                        <a href="forum.php?mod=guide&view=$key" class="more-link">{lang more} 禄</a>                </div>                <!--{/loop}-->        </div>        <!-- 鍐呭閮ㄥ垎淇濇寔涓嶅彉 -->        <!--{loop $data $key $list}-->        <div id="tab-$key" class="guide-content">                <div class="xl xl2 cl">                        <!--{if $list['threadcount']}-->                                <!--{eval $i=0;}-->                                <!--{loop $list['threadlist'] $thread}-->                                <!--{eval $i++;$newtd=$i%2;}-->                                <li{if !$newtd} class="xl2_r"{/if}>                                        <em>                                                <!--{if $key == 'hot'}--><span class="xi1">$thread[heats]{lang guide_attend}</span><!--{/if}-->                                                <!--{if $key == 'new'}-->$thread[lastpost]<!--{/if}-->                                        </em>                                        <i>路 <a href="forum.php?mod=viewthread&tid=$thread[tid]&{if $_GET['archiveid']}archiveid={$_GET['archiveid']}&{/if}extra=$extra"$thread[highlight] target="_blank">$thread[subject]</a></i> <span class="xg1"><a href="forum.php?mod=forumdisplay&fid=$thread[fid]" target="_blank">$list['forumnames'][$thread[fid]]['name']</a></span>                                </li>                                <!--{/loop}-->                        <!--{else}-->                                <p class="emp">{lang guide_nothreads}</p>                        <!--{/if}-->                </div>        </div>        <!--{/loop}-->        <script>        jQuery(document).ready(function($) {                // 榛樿鏄剧ず绗竴涓爣绛剧殑鍐呭                $('.guide-tab').first().addClass('active');                $('.guide-content').first().addClass('active');                // 榧犳爣鍒掑姩鏄剧ず瀵瑰簲鍐呭                $('.guide-tab').hover(function() {                        // 绉婚櫎鎵€鏈夋縺娲荤姸鎬                        $('.guide-tab').removeClass('active');                        $('.guide-content').removeClass('active');                        // 娣诲姞褰撳墠婵€娲荤姸鎬                        $(this).addClass('active');                        var target = $(this).data('target');                        $('#' + target).addClass('active');                });        });        </script>

鍦ㄥ璇婚椤垫枃浠讹紝鎵惧埌锛<!--{if $view == 'index'}-->锛屼笅闈iv鏍囩锛屽湪杩欐暣涓猟iv鏍囩閲岋紝<!--{else}-->涓婏紝鏇挎崲涓婇潰鍐呭锛屽嵆鍙€
鍥犲師濮嬫枃浠舵洿鏀硅繃锛屾煡鐪嬮粯璁ゆā鏉挎枃浠跺ソ璞54-83琛屻€
鍏跺畠缁嗚妭锛屼綘杩樺彲浠ヨ嚜宸辩户缁紭鍖栥€