Skip to content

[HTML] 將區塊當中的文字隱藏

Last Updated on 2021-06-08 by Clay

今天要紀錄的是在撰寫 HTML 當中,如何隱藏區塊。之所以想要製作這個功能,純粹是因為我想要撰寫一個『複製』文字的功能,但是這個『文字』的部份不打算顯示在頁面上。

要做到這樣的功能,其實也相當容易,只要在 "style" 當中設定 "display: none" 即可。以下就簡單地進行示範。


隱藏 HTML 當中的區塊

首先,我先撰寫一個簡單的 HTML 檔:

<p>1</p>
<p>2</p>
<p>3</p>



Output:


然後,若是我們想要隱藏 "2" 顯示的區塊,那麼我們可以將程式修改為:

<p>1</p>
<p style="display: none">2</p>
<p>3</p>



Output:

我們可以看到,雖然 "2" 的區塊仍然存在我們的程式碼,但是在顯示的頁面上卻是成功隱藏著的。

Tags:

Leave a Reply