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>标签。标签成对出现，因此总会有一个结束符 </abbr>标签可用。

属性：正如我们在语法中看到的，标题标签与一起使用时，会显示标题标签。标签成为一个属性并为其分配特殊功能。否则，没有更多特定标签可与一起使用。标签，但是这个标签 ;支持 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中文网其他相关文章！