<blockquote>: 塊級引用元素
<blockquote> HTML 元素表示其包含的文字是擴充套件引用的文字。通常,這會以縮排(關於如何更改,請參閱 “使用說明”)的形式在視覺上呈現。引用的來源 URL 可以使用 cite 屬性指定,而來源的文字表示可以使用 <cite> 元素來提供。
試一試
<div>
<blockquote cite="https://www.huxley.net/bnw/four.html">
<p>
Words can be like X-rays, if you use them properly—they’ll go through
anything. You read and you’re pierced.
</p>
</blockquote>
<p>—Aldous Huxley, <cite>Brave New World</cite></p>
</div>
div:has(> blockquote) {
background-color: #ededed;
margin: 10px auto;
padding: 15px;
border-radius: 5px;
}
blockquote p::before {
content: "\201C";
}
blockquote p::after {
content: "\201D";
}
blockquote + p {
text-align: right;
}
屬性
此元素的屬性包括全域性屬性。
cite-
一個指定引述資訊的來源文件或訊息的 URL。此屬性旨在指向解釋引述的上下文或參考資訊。
用法說明
根據規範,引述的署名(如果有)必須放在 <blockquote> 元素之外。
要更改應用於引述文字的縮排,請使用 CSS 的 margin-left 和/或 margin-right 屬性,或使用 margin 簡寫屬性。
要包含較短的行內引用而非單獨的塊級引用,請使用 <q>(引用)元素。
示例
此示例演示瞭如何使用 <blockquote> 元素引用 RFC 1149 中的一段話,其標題為 _《透過禽類載體傳輸 IP 資料報的標準》_。
html
<blockquote cite="https://datatracker.ietf.org/doc/html/rfc1149">
<p>
Avian carriers can provide high delay, low throughput, and low altitude
service. The connection topology is limited to a single point-to-point path
for each carrier, used with standard carriers, but many carriers can be used
without significant interference with each other, outside early spring. This
is because of the 3D ether space available to the carriers, in contrast to
the 1D ether used by IEEE802.3. The carriers have an intrinsic collision
avoidance system, which increases availability.
</p>
</blockquote>
結果
技術摘要
規範
| 規範 |
|---|
| HTML # the-blockquote-element |
瀏覽器相容性
載入中…
另見
- 用於行內引用的
<q>元素。 - 用於來源引用的
<cite>元素。 - 透過 heydonworks.com (2024) 提供的 blockquote 元素