HTML 縮寫標籤-html教學-PHP中文網

HTML 縮寫標籤

王林

發布： 2024-09-04 16:26:50

原創

1028 人瀏覽過

HTML 5 具有有趣的功能，可以使用最少的程式碼編寫 HTML 網頁變得更簡單。它提供了一組豐富的有趣標籤來設計網頁元素。一個這樣的標籤很有用，它被稱為。標籤。這個標籤用於一次性定義和顯示縮寫。 HTML abbr 標籤將允許我們定義縮寫或首字母縮寫的完整形式，瀏覽器通常會在網頁上顯示字母的簡短版本，但將滑鼠懸停在這些縮寫上時，瀏覽器將顯示完整形式的自動出現該縮寫詞。

HTML 縮寫標籤的語法

;標籤通常與

一起使用。屬性。由於標題標籤用於定義文件的標題，因此當與 <abbr> 一起使用時，標題將被定義為文件的標題。標籤成為一個屬性並對其具有特殊意義。標題將包含人類可讀的標題或縮寫詞的完整形式。標籤在懸停時向使用者顯示完整的表單，並簡化定義描述。這些資訊對於瀏覽器、搜尋引擎和翻譯系統等輔助系統更有用。以下是 abbr 標籤的語法， <ul> <li><strong>正常縮寫標籤：</strong></li> </ul> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><abbr> PFA </abbr></pre><div class="contentsignin">登入後複製</div></div> <p>這只會顯示簡單的文本，沒有任何意義。假設我們要使用上面縮寫的指定完整形式，即 PFA，則 </p> <title>使用屬性， <ul> <li><strong>標題標籤的縮寫標籤：</strong></li> </ul> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><abbr title = "Please Find Attached" > PFA </abbr></pre><div class="contentsignin">登入後複製</div></div> <p>在這裡，我們將顯示標題定義為短格式，但同時，我們使用 <abbr> 定義了它的完整形式。標籤以及 <title>標籤。標籤成對出現，因此總會有一個結束符號標籤可用。

屬性：如我們在語法中看到的，標題標籤與一起使用時，會顯示標題標籤。標籤成為一個屬性並為其指派特殊功能。否則，沒有更多特定標籤可與一起使用。標籤，但是這個標籤 ;支援 HTML 中預設提供的全域屬性和事件屬性。

實作 HTML 縮寫標籤的範例

以下是實作 HTML 縮寫標籤的範例：

範例#1

在此範例中，我們可以看到沒有標題標籤的簡單縮寫。

代碼：

<!DOCTYPE html>
<html>
<head>
<title> abbr tag in HTML </title>
<style>
body {
text-align: left ;
}
</style>
</head>
<body>
<abbr > PFA </abbr>
</body>
</html>

登入後複製

輸出： 將是以下簡單文本，

HTML 縮寫標籤

範例#2

在此範例中，我們可以看到帶有標題標籤的縮寫。

代碼：




 abbr tag in HTML 



<abbr title = "Please Find Attached" > PFA </abbr>

登入後複製

輸出： 將是帶有有點底線的縮寫。

HTML 縮寫標籤

如果我們嘗試將滑鼠懸停在其上，它將顯示我們以與工具提示類似的方式給出的標題。

範例 #3

在這裡，我們使用 CSS 樣式元素字體樣式作為上的斜體。標籤。

代碼：




 abbr tag in HTML 



 while writing an email, generally <abbr title = "Please Find Attached" > PFA </abbr> is used

登入後複製

輸出：

HTML 縮寫標籤

範例#4

讓我們在上使用更多 CSS 樣式元素。標籤。

代碼：




 abbr tag in HTML 



 while writing an email, generally <abbr title = "Please Find Attached" > PFA </abbr> is used

登入後複製

輸出：

HTML 縮寫標籤

在這裡，我們使用 CSS 樣式元素將首字母縮寫設為粗體和紅色。

範例#5

讓我們修改同一範例以添加更多樣式和設計。

代碼：




 abbr tag in HTML 



 while writing an email, generally <abbr title = "Please Find Attached" > PFA </abbr> is used

登入後複製

輸出：

HTML 縮寫標籤

在上面的每個範例中，嘗試將滑鼠懸停在我們使用的首字母縮寫（即 PFA）上方，並查看瀏覽器將如何顯示我們分配給它的標題。

要記住的重要要點

;幾乎所有瀏覽器都支援該標籤，包括 Google Chrome、Internet Explorer、Safari、Firefox、Opera 等。所有瀏覽器產生的輸出在某些情況下可能會有所不同，但結果是相同的。
由於沒有可用的特定屬性；標籤，我們將在接下來的範例中看到如何對屬性進行樣式化（使用可用的全域屬性）。顯示此元素的預設樣式是 display: inline，並且它可能會因瀏覽器而異。
;標籤可用於向使用者提供完整的表單，或在特定內容中定義，或在設計文件樣式的情況下。並不強制要求始終使用。標籤。
;屬性用於提供中指定首字母縮寫的完整資訊或完整形式。標籤。屬性是可選的，它將用在的起始標記。標籤。
曾經有一個 HTML 5 之前的標籤用於定義縮寫詞或首字母縮略詞，但它已從 HTML 5 中棄用，不應使用。

結論

所以，我們已經看到了 HTML 5 中引入的標籤。該標籤提供了定義縮寫或首字母縮寫並一次性顯示其標題或詳細資訊的方法。我們已經看到了的多個例子。屬性。此標籤沒有此類特殊屬性。

以上是HTML 縮寫標籤的詳細內容。更多資訊請關注PHP中文網其他相關文章！