在網頁開發中，標簽(tab)效果是很常見的，通常用于展示不同的內容和選項卡切換。在HTML中實現tab效果的方法很多，這里介紹兩種。
<ul><li>選項卡1</a></li><li>選項卡2</a></li><li>選項卡3</a></li></ul><div id="tab1">選項卡1的內容</div><div id="tab2">選項卡2的內容</div><div id="tab3">選項卡3的內容</div>
以上代碼使用無序列表和div實現tab效果，通過設置不同的id和href屬性完成選項卡的切換。其中，href屬性指向對應div的id屬性，點擊列表中的鏈接就可以切換顯示不同內容的選項卡。
<div class="tab-box"><input type="radio" name="tab" id="tab1" checked><label for="tab1">選項卡1</label><div>選項卡1的內容 </div><input type="radio" name="tab" id="tab2"><label for="tab2">選項卡2</label><div>選項卡2的內容 </div><input type="radio" name="tab" id="tab3"><label for="tab3">選項卡3</label><div>選項卡3的內容 </div></div>
以上代碼使用radio和label元素實現tab效果，適用于對樣式靈活性有需求的情況。通過為radio和label元素設置相同的name屬性和不同的id屬性，同時讓radio元素默認選中一個，通過CSS樣式選擇器可以控制選項卡內容的顯示。
上一篇mysql取前綴