HTML5讓代碼折疊變得更加容易。
在過去，為了展示代碼，我們經常使用pre標簽。這個標簽讓所有的空格和縮進都被保留，以便代碼整潔地呈現。
然而，我們通常會寫很長的代碼，這些代碼會使頁面變得非常長。對于用戶來說，這非常不方便。他們不得不滾動很長的頁面來找到他們想看的內容。
這就是折疊代碼的好處。它可以讓我們將一段代碼壓縮成一個小按鈕，當用戶單擊該按鈕時，代碼就展開了。
有幾種方法可以實現折疊代碼。其中之一是使用JavaScript。我們可以編寫JavaScript函數來切換代碼的顯示和隱藏，然后將這個函數附加到折疊按鈕上。
另一種方法是使用HTML5的details和summary標簽。這兩個標簽可以讓我們快速創建折疊代碼。我們只需要將我們的代碼包裝在details標簽中，將按鈕放在summary標簽中，即可完成。
例如：
<details>
<summary>Click to expand</summary>
<p>This is some code</p>
</details>