参考资料

  1. HTML 标签
  2. HTML 段落
  3. HTML 内联式
  4. html元信息标签详细说明以及案例
  5. HTML移除边框 Iframe
  6. HTML 用于联系信息的
  7. HTML 有用的提示
  8. HTML 表格

HTML 块引用格式化

详细介绍

HTML 块引用(Blockquote)用于标记从其他来源引用的内容块,通常浏览器会将其显示为缩进段落。

标签

主要使用 <blockquote> 标签:

<blockquote>这是引用的内容</blockquote>

可选使用 cite 属性指明引用来源:

<blockquote cite="https://example.com/source">
  这是引用的内容
</blockquote>

用法

  1. 基本引用:

<blockquote>
  <p>这是引用的段落内容</p>
</blockquote>
  1. 带来源的引用:

<blockquote cite="https://example.com">
  <p>引用内容</p>
  <footer>— 来源名称, <cite>作品标题</cite></footer>
</blockquote>

功能

  • 语义化标记引用内容

  • 默认浏览器样式通常为缩进显示

  • 可通过 cite 属性提供引用来源URL

CSS 扩展

/* 基本样式 */
blockquote {
  margin: 1em 40px;
  padding: 0.5em 1em;
  border-left: 4px solid #ccc;
  font-style: italic;
}

/* 引用符号样式 */
blockquote:before {
  content: "\201C";
  font-size: 3em;
  line-height: 0.1em;
  vertical-align: -0.4em;
}

/* 来源样式 */
blockquote footer {
  display: block;
  font-style: normal;
  font-size: 0.9em;
  color: #666;
}

blockquote cite {
  font-style: italic;
}