HTML_7——引用

1. q元素

1.1 定义

HTML <q> 元素定义短的引用

浏览器通常会为 <q> 元素包围引号

1.2 实例





<p>浏览器通常会在 q 元素周围包围引号。</p>

<p>WWF 的目标是 <q>构建人与自然和谐相处的世界。</q></p>



image-20210818155753845

2. blockquote元素

2.1 定义

HTML <blockquote> 元素定义被引用的节。用于长引用

浏览器通常会对 <blockquote> 元素进行缩进处理。

2.2 实例





<p>浏览器通常会对 blockquote 元素进行缩进处理。</p>

<blockquote cite="http://www.worldwildlife.org/who/index.html">
五十年来,WWF 一直致力于保护自然界的未来。
WWF 工作于 100 个国家,并得到美国一百二十万会员及全球近五百万会员的支持。
</blockquote>




image-20210818155825536

3. abbr元素

3.1 定义

HTML <abbr>元素定义缩写或首字母缩略语。

对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。

3.2 实例





<p><abbr title="World Health Organization">WHO</abbr> 成立于 1948 年。</p>

<p>对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。</p>



image-20210818155912298

4. dfn元素

4.1 定义

HTML <dfn>元素定义项目或缩写的定义

<dfn> 的用法,按照 HTML5 标准中的描述,有点复杂:

4.2 属性

a. title属性

如果设置了 <dfn> 元素的 title 属性,则定义项目:

实例





<p>The <dfn title="World Health Organization">WHO</dfn> was founded in 1948.</p>

<p>对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。</p>




image-20210818161229318

b. 包含<abbr>元素

如果 <dfn> 元素包含具有标题的 <abbr> 元素,则 title 定义项目:

实例





<p>The
<dfn><abbr title="World Health Organization">WHO</abbr></dfn>
was founded in 1948.
</p>

<p>对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。</p>




image-20210818160123157

c. 若无特别设置属性

否则,<dfn> 文本内容即是项目,并且父元素包含定义。

实例





<p>The
<dfn>WHO</dfn> World Health Organization was founded in 1948.
</p>

<p>对缩写进行标记能够为浏览器、翻译系统以及搜索引擎提供有用的信息。</p>




image-20210818160216498

5. address属性

5.1 定义

HTML

元素定义文档或文章的联系信息(作者/拥有者)。

此元素通常以斜体显示。大多数浏览器会在此元素前后添加折行。

5.2 实例





<p>HTML address 元素定义文档或文章的联系信息(作者/拥有者)。</p>

<address>
Written by Jon Doe.<br> 
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
USA
</address>




image-20210818160301095

6. cite元素

6.1 定义

HTML 元素定义著作的标题

浏览器通常会以斜体显示 <cite> 元素。

6.2 实例





<p>HTML cite 元素定义著作的标题。</p>
<p>浏览器通常会以斜体显示 cite 元素。</p>

<img src="img_the_scream.jpg" width="220" height="277" alt="The Scream">
<p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p>





image-20210818160327020

7. bdo元素

7.1 定义

HTML 元素定义双流向覆盖(bi-directional override)。

<bdo> 元素用于覆盖当前文本方向:从左往右显示文字或是从右往左显示文字rtl、ltr

7.2 实例





<p>
如果您的浏览器支持 bdo,则文本将从右向左进行书写 (rtl):
</p>

<bdo dir="rtl">
This line will be written from right to left
</bdo>




image-20210818160400051

8. Ruby元素

8.1 定义

<ruby> 标签定义注音符号。<ruby> 标签定义 ruby 注释(中文注音或字符)

8.2 实例




    <meta charset="utf-8">
    <title>鱼C-零基础入门学习Web(Html5+Css3)</title>


    <ruby>
        小 <rp>(</rp><rt>xiǎo</rt><rp>)</rp>
        甲 <rp>(</rp><rt>jiǎ</rt><rp>)</rp>
        鱼 <rp>(</rp><rt>yú</rt><rp>)</rp>
    </ruby>


image-20210818162421833

9. 参考

HTML引用元素

Ruby元素

posted @ 2021-08-23 01:10  Nadir-Echo  阅读(121)  评论(0)    收藏  举报