首頁 >web前端 >css教學 >如何僅使用 CSS 隱藏 HTML 中未標記的文字?

如何僅使用 CSS 隱藏 HTML 中未標記的文字?

Barbara Streisand
Barbara Streisand原創
2024-12-27 14:47:10184瀏覽

How Can I Hide Untagged Text in HTML Using Only CSS?

在HTML 中隱藏沒有HTML 標籤的文字

問題:

您的ML程式碼包含周圍缺少任何HTML 標記的文字。具體來說,您想要隱藏緊接在「p」標記之後的文字「Enter」。但是,不可能用 HTML 元素包裹文字。

解決方案:CSS 字體大小技巧

要實現您的目標,您可以採用CSS hack利用font-size 屬性:

  1. 建立一個類,例如“.entry”,並將其字體大小指定為0:
.entry {
  font-size: 0;
}
  1. 在此類別中,新增通配符選擇器(「*」)以將字體大小設定回其初始值:
.entry * {
  font-size: initial;
}

預設情況下,所有元素都會繼承其父元素的字體大小。但是,透過將「.entry」類別的字體大小設為 0,您可以有效地隱藏其所有子元素。然後,通配符選擇器會覆寫任何嵌套元素的此設置,從而允許顯示其文字。

範例:

在程式碼中,套用「.entry」類別到父div 並確保「Enter」文字屬於此類:

<div>

使用此CSS 技巧, “Enter”文字將被隱藏,而“.entry”類別中的其餘內容仍然可見。

以上是如何僅使用 CSS 隱藏 HTML 中未標記的文字?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn