关于前端学习:HTML标签HTML5-语义化标签

援用标签

• 援用大段文本：<blockquote></blockquote>

  • 特点：援用的文本会独立进去，左右主动进行缩进

• 援用小段文本：<q></q>

  • 特点：援用的文本不会独立进去，被援用的文本主动应用双引号包裹

• 被援用的文档信息：<address></address>

  • 特点：斜体显示

• 被援用的文档的题目：<cite></cite>

  • 特点：斜体显示

• 文本的缩写或单词缩略词：<abbr title=""></abbr>

  • title 属性内写缩写或缩略词的全称

语义化标签

• 页面头部：<header></header>
• 页面主体：<main></main>
• 页面尾部：<footer></footer>
• 题目组合：<hgroup></hgroup>
• 导航栏：<nav></nav>
• 输入：<output></output>
• 画布：<canvas></canvas>

• 页面区域划分

  • 区域区块划分：<article></article>
  • 次要区域划分：<section></section>
  • 辅助区域划分：<aside></aside>

文档题目、细节开合管制

• 题目：<summary></summary>

• 细节：<details></details>

  <details open>
    <summary>HTML 5</summary>
    This document teaches you everything you have to learn about HTML 5.
  </details>
  
  open 属性管制默认是否关上显示 

进度条、度量范畴

 进度条
<progress value="22" max="100"></progress> 

度量范畴
<meter value="3" min="0" max="10"> 非常之三 </meter>

日期、工夫

<time datetime="2008-02-14"> 情人节 </time>

带有标记的文本

<mark>milk</mark>

代码块标签

• pre 元素包裹的内容将保留空格与换行符

• code 元素将文本内容转化为等宽字体，示意这是一段源代码程序

  <pre>  
    <code></code>  
  </pre>

文字注解、注音

• ruby：突围要注音的文字，内含三个元素。
• rb：要注音的对象

• rp：若浏览器不反对 ruby 那么上例就会顺次显示 rb rp rt rp rb 内容在同一行。如果浏览器反对，那么 rp 内容 不会显示。如上例，在 IE8 下可能会显示成 吉林大学 (ji lin da xue)

  <ruby>
    <rb> 吉林大学 </rb>
    <rp>(</rp>
    <rt>ji lin da xue</rt>
    <rp>)</rp>
  </ruby>

设置文本方向

• dir 属性：属性值有两个 ltr、rtl

<bdo  dir="rtl">123</bdo>

罕用特殊字符