選擇卡Tab排版

1 選項卡切換原理

選項卡切換包括2項關鍵技術：
1、選項卡標籤項與選項卡內容項的關聯
實現關聯最簡單的辦法是建立HTML結構時就使選項卡標籤項與選項卡內容項的順序一一對應，當觸發第n個選項卡標籤時，就切換第n個選項卡內容區可見。
2、選項卡內容項的隱藏控制
顯隱控制的基本邏輯是顯示時添加定義display:block聲明的類樣式（如.active），隱藏時則刪除定義了display:block聲明的類樣式（如.active）即可。

2 編寫HTML文件

在這裏插入代碼片

3 編寫CSS樣式

在這裏插入代碼片

4 編寫JS腳本

在這裏插入代碼片