CSS3折疊標簽是一種非常實用的技術，它可以讓網頁元素在不占用太多空間的前提下，展現更多的內容。下面就來介紹一下CSS3折疊標簽的具體用法。

/* CSS3折疊標簽的基本樣式 */
.fold {
display: inline-block;
cursor: pointer;
border-bottom: 1px dashed #000;
}
.fold:hover {
color: #f00;
}
.fold-content {
display: none;
}

以上代碼定義了CSS3折疊標簽的基本樣式，包括折疊標簽的展示、鼠標懸停時的樣式、以及內容的隱藏。

點擊我
這里是內容

在HTML中，可以利用以上CSS3折疊標簽的基本樣式，通過結構組合來實現折疊標簽的具體效果。其中，折疊標簽的展示部分為一個普通的段落，而折疊內容則使用一個div來包裹。

// JavaScript交互
var fold = document.querySelector('.fold');
var content = document.querySelector('.fold-content');
fold.addEventListener('click', function() {
if (content.style.display == 'none') {
content.style.display = 'block';
} else {
content.style.display = 'none';
}
});

最后，利用JavaScript實現折疊標簽的交互效果。當點擊折疊標簽時，判斷折疊內容的當前狀態，如果是隱藏，則顯示折疊內容；如果是展開，則隱藏折疊內容。

以上就是關于CSS3折疊標簽的介紹，希望對大家有所幫助！