Html 简明教程

HTML - Quotations

HTML 中的引号允许你在 Web 内容中包含并设置引文文本的格式。这些用于引用任何句子或关键字，有一系列用于创建引用的标签。

这些标签有助于维护适当的格式和语义，从而增强引文内容在网页上的呈现和含义。准确传达信息并在良好的组织中为用户提供阅读体验，因此纳入引用至关重要。

HTML Quotation Tags List

HTML <q> Tag
HTML <blockquote> Tag
HTML <cite> Tag
HTML <address> Tag
HTML <bdo> Tag
HTML <abbr> Tag

下面我们为引文使用了每个标记，每个标记都有其默认样式，其中一些标记接受一些属性，但我们未使用任何属性来更改其默认样式。

HTML "<q>" for Quotations

我们使用 * <q>* 标记在 HTML 中添加短引号。而如果我们要引用多行，请使用 <blockquote> 标记。我们还可以在 <blockquote> 标记内使用 cite 属性以 URL 形式指示引用的来源。

Example

<!DOCTYPE html>
<html>
<head>
   <title>HTML Quotation tag</title>
</head>
<body>
   <p>
      DLF stands for <q>Delhi Land and Finance</q>
   </p>
   <p>
      Delhi Land and Finance is one of the largest
      commercial real estate developer in India.
   </p>
</body>
</html>

Output

DLF stands for Delhi Land and Finance
Delhi Land and Finance is one of the largest commercial real estate developer in India.

HTML "<blockquote>" for Quotations

<blockquote>* 标记用于表示长引文。它应该只包含其中的块级元素，而不仅仅是纯文本。它指定从另一个来源引用的部分，并且只包含块级元素。我们还可以在 <blockquote> 标记内使用 cite 属性以 URL 形式指示引用的来源。

Example 1

<!DOCTYPE html>
<html>

<body>
   <p>
      About Tutorialspoint
   </p>
   <blockquote>
      Tutorialspoint originated from the idea that there exists
      a class of readers who respond better to online content and
      prefer to learn new skills at their own pace from the comforts
      of their drawing rooms.
   </blockquote>
</body>

</html>

Output

About Tutorialspoint
Tutorialspoint originated from the idea that there exists a class of readers who respond
better to online content and prefer to learn new skills at their own pace from the comforts
of their drawing rooms.

Example 2

<!DOCTYPE html>
<html>

<body>
   <h1>Tutorialspoint</h1>
   <p>
      Here is a quotation from Tutorialspoint’s official website
   </p>
   <blockquote cite="https://www.tutorialspoint.com">
      Join our millions of loyal visitors to access our free Text Library.
      From programming languages and web development to data science and
      cybersecurity, our masterfully crafted Tutorials will help you master
      any technology or concept from scratch.
   </blockquote>
</body>

</html>

Output

Here is a quotation from Tutorialspoint’s official website
Join our millions of loyal visitors to access our free Text Library. From programming languages
and web development to data science and cybersecurity, our masterfully crafted Tutorials will
help you master any technology or concept from scratch.

HTML "<cite>" for Quotations

HTML 中的 * <cite>* 标记用于在内容中引用创意作品的标题，例如书籍、电影或歌曲。它为引文提供了语义含义。以下是一个编码示例 −

Example

<!DOCTYPE html>
<html>

<body>
   <p>
      The information is sourced from
      <cite>The Elements of Style</cite>
      by Strunk and White.
   </p>
</body>

</html>

Output

The information is sourced from The Elements of Style by Strunk and White.

HTML "<address>" for Quotations

<address>* 标记在 HTML 中用于定义文档的作者或所有者的联系信息。它通常包括诸如电子邮件地址、物理地址或其他相关联系信息之类的详细信息。这是一个示例 −

Example

<!DOCTYPE html>
<html>
<body>
<address>
   Contact us at: <a href="mailto:info@example.com">info@example.com</a><br>
   Visit us at: 123 Main Street, Cityville
</address>
</body>
</html>

Output

Contact us at: info@example.com
Visit us at: 123 Main Street, Cityville

HTML "<bdo>" for Quotations

HTML 中的 * <bdo>* 标签， bdo 代表双向覆盖，用于覆盖当前文本方向。它通常用于需要更改默认文本方向的情况，例如，从右至左显示文本。示例如下：

Example

<!DOCTYPE html>
<html>

<body>
   <p>This text will go left to right.</p>
   <p><bdo>
      Welcome to Tutorialspoint.
   </bdo></p>
</body>

</html>

Output

Welcome to Tutorialspoint.

HTML "<abbr>" for Quotations

HTML 中的 * <abbr>* 标签用于定义缩写或首字母缩写词。在此示例中， <abbr> 用于将“Abhishek”缩写为“Abhy”，而“title”属性提供了缩写的完整描述。

Example

<!DOCTYPE html>
<html>
<head>
   <title>Abbreviation Tag Example</title>
</head>
<body>
   <p>My best friend's name is <abbr title="Abhishek">Abhy</abbr>.</p>
</body>
</html>

Output

My best friend's name is Abhy.