HTML标记语言——引用

请看下面的攻略。

什么是HTML引用标签

HTML的引用标签用于包含一个引用或者称之为一个摘录,因此它也被称为摘录标签。可以使用 <q> 标签为短引用括起来,也就是说,文本中的一个小片段需要被引用的时候,可以使用这个标签。而如果需要引用的内容比较长,那么就需要使用 <blockquote> 标签包裹。这样就可以在内容前后添加引号和缩进(在大多数浏览器中,默认值是 40 像素左右)。下面我们分别讲解用法和一些示例。

使用HTML引用标签

<q> 标签

<q> 标签可以用于短的引用或者从外部的来源拿来的文本片段,该标签会添加一个小引号在引用的前面和后面,如下面的示例代码:

<p>以下是著名的权利宣言之一:</p>

<q>我们认为,这些真理是不言而喻的:人人生而平等;他们被造就时,赋予了若干不可剥夺的权利,其中包括生命权、自由权和幸福追求权。</q>

<p>以上是著名的权利宣言之一。</p>

上面的代码将会渲染为以下的HTML文本:

<p>以下是著名的权利宣言之一:</p>

<p><q>我们认为,这些真理是不言而喻的:人人生而平等;他们被造就时,赋予了若干不可剥夺的权利,其中包括生命权、自由权和幸福追求权。</q></p>

<p>以上是著名的权利宣言之一。</p>

在上述例子中,<q> 标签被用来引用权利宣言中的一句话,小引号会自动添加并包含在文本中。

<blockquote> 标签

<blockquote> 标签用于包裹需要引用的文本,并且这段文本会默认产生一个比较深的缩进。下面是一个包含 <blockquote> 标签的例子:

<blockquote>
  <p>当我发觉我什么都不懂的时候,我就开始认为我是不是活得不对头。</p>
  <cite>——钱钟书</cite>
</blockquote>

上面的代码将会渲染为以下的HTML文本:

<blockquote>
  <p>当我发觉我什么都不懂的时候,我就开始认为我是不是活得不对头。</p>
  <cite>——钱钟书</cite>
</blockquote>

在上面的例子中,<blockquote> 标签被用于引用了一段来自钱钟书的文字,并用 <cite> 标签注明了出处。

结束语

HTML 引用标签是为了方便作者在文本中插入摘录和引用而创造的。使用这些标签,可以方便地在内容中插入引用和摘录,帮助读者更好地理解文章内容。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:HTML标记语言——引用 - Python技术站

(0)
上一篇 2023年6月9日
下一篇 2023年6月9日

相关文章

  • 定义span的最小高度没有效果的解决方法

    为了解释 “定义 span 的最小高度没有效果” 这个问题,我们需要先理解 span 元素的基本属性。 span 元素是一种内联元素,其宽度和高度通常会根据其包含的内容自适应调整。 当我们给 span 元素定义一个最小高度时,很多情况下会发现这个最小高度并没有生效。这是因为内联元素的高度受其包含内容影响,我们需要针对这一点来找到解决方法。 以下是两个示例,说…

    css 2023年6月10日
    00
  • JS+CSS实现Li列表隔行换色效果的方法

    下面是JS+CSS实现Li列表隔行换色效果的方法完整攻略。 1. 使用CSS的nth-child选择器 CSS中可以使用:nth-child选择器来选择列表中的每一个元素,可以通过设置对应的颜色来实现隔行换色的效果。 首先,在样式表中添加以下代码: li:nth-child(even) { background-color: #f2f2f2; } li:nt…

    css 2023年6月10日
    00
  • 浅析Bootstrap缩略图组件与警示框组件

    浅析Bootstrap缩略图组件与警示框组件 Bootstrap是一个经典的前端框架,提供了许多实用的组件和工具。本文将为大家介绍Bootstrap中的缩略图组件和警示框组件。 缩略图组件 在Bootstrap中,缩略图组件一般用于显示一组图片或者视频的缩略图,非常适合用于多媒体网站、电商网站等等。 基本用法 缩略图组件的基本代码如下: <div cl…

    css 2023年6月11日
    00
  • 基于JQuery的6个Tab选项卡插件

    首先,为了介绍6个Tab选项卡插件,需要先对jQuery库以及jQuery UI库有一定的了解。jQuery 是一款优秀的 JavaScript 库,它允许你在网页中轻松地精简 HTML 和操作文档。由于它的跨浏览器特性和简洁的语言写法,现在已经很多网站都在使用 jQuery。而jQuery UI是jQuery的用户界面插件,它提供了许多交互效果和插件,其中…

    css 2023年6月10日
    00
  • vue-cli脚手架引入弹出层layer插件的几种方法

    让我来详细讲解“vue-cli脚手架引入弹出层layer插件的几种方法”的完整攻略。 1. 安装layer插件 在使用layer插件之前,需要先进行安装,可以通过npm进行安装,执行如下命令: npm install layer 2. 在Vue项目中引入layer插件 在Vue项目中引入layer插件有如下几种方法: 方法1:在Vue组件中引入 在需要使用l…

    css 2023年6月9日
    00
  • 怎么免费激活DA-HelpCreator 附激活教程+注册机

    关于怎样免费激活DA-HelpCreator的过程,这里提供一份完整的攻略,步骤如下: 步骤一:下载DA-HelpCreator 首先,前往DA-HelpCreator官方网站 (https://www.da-helpcreator.com/index.html) 下载最新版的DA-HelpCreator软件(请注意,此软件是一款商业软件,但是提供30天的免…

    css 2023年6月10日
    00
  • javascript自定义滚动条实现代码

    下面是关于JavaScript自定义滚动条的实现攻略及示例说明。 一、背景介绍 在网页中,经常需要应用到滚动条,用以浏览超出当前可见区域的部分。但是浏览器的原生滚动条显示样式较为简单,不够美观;而且在不同浏览器上样式差异较大,不够统一。因此,很多网页都会采用自定义滚动条的方式,使其样式更加漂亮,且在不同浏览器上显示效果相似。 二、实现方法 下面介绍一种利用J…

    css 2023年6月10日
    00
  • js cavans实现静态滚动弹幕

    1. 简介 Cavans 是 HTML5 新增的元素,它可以让开发者在浏览器上绘制图形、动画等。本篇攻略讲解如何使用 Canvas 实现静态的滚动弹幕。 2. 准备工作 为了使用 Canvas 实现滚动弹幕,需要先在 HTML 中添加一个 Canvas 元素。以下是添加 Canvas 元素的示例代码: <canvas id="myCanvas…

    css 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部