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

HTML 縮寫標籤的語法

實作 HTML 縮寫標籤的範例

範例#5

要記住的重要要點

結論

首頁

web前端

html教學

HTML 縮寫標籤

王林

Sep 04, 2024 pm 04:26 PM

html html5 HTML Tutorial HTML Properties HTML tags

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 中棄用，不應使用。