為了實現這個功能，我們還需要添加一些JavaScript代碼：

function openTab(evt, tabName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(tabName).style.display = "block";
evt.currentTarget.className += " active";
}

該函數獲取被單擊的按鈕的事件對象和相應標簽的名稱作為參數。它首先使用getElementsByClassName()方法獲取所有class名為“tabcontent”的元素，并使用循環隱藏它們。然后，它使用getElementsByClassName()方法獲取所有class名為“tablinks”的元素，并使用循環刪除它們的“活動”類。接著，它根據相應的標簽名稱調用document.getElementById()方法來顯示相應的標簽內容，并將被單擊的按鈕的活動類設置為“活動”。

我們可以根據需要自定義標簽頁的樣式和布局。這是一種非常有用的功能，因為它可以使頁面更加交互和易于使用。