html5标签,html5标签大全

html5新增标签有哪些

html5新增标签如下：

创新互联建站成立与2013年，是专业互联网技术服务公司，拥有项目网站建设、成都网站建设网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元浦东做网站,已为上家服务,为浦东各地企业和个人服务,联系电话:18982081108

1、结构性标记结构性标记主要用来对页面结构进行划分，就像在设计网页时将页面分为导航、内容部分、页脚等，确保HTML文档的完整性。

2、多媒体标记多媒体标记主要解决了以往通过Flash等进行视频的一些展示，新增的标记使HTML功能变得更加强大了。

3、表单标记表单标记主要用于功能性的内容表达，会有一定的内容和数据的关联。

html5的意义及应用。

在HTML页面中，带有“ ”符号的元素被称为HTML标签，如上面提到的 HTML、head、body都是HTML标签。所谓标签就是放在“ ” 标签符中表示某个功能的编码命令，称为HTML标签。

该语法中“标签名”表示该标签的作用开始，一般称为“开始标签（start tag）”，“/标签名” 表示该标签的作用结束，一般称为“结束标签（end tag）”。和开始标签相比，结束标签只是在前面加了一个关闭符“/”。

html5新增的标签有什么？

新增的结构标签：

1、header元素

表示页面中一个区块或真个页面的标题。

2、内hgroup元素

表示对真个页面或页面中的容一个内容区块的标题进行组合。

3、article元素

表示页面中一块与上下文不相关的独立内容。比如一篇文章。

4、aside元素

表示article元素内容之外的、与article元素内容相关的辅助信息。

5、footer元素

表示整个页面或页面中一个内容区块的脚注。一般来说，他会包含创作者的姓名、创作日期以及创作者的联系信息。

HTML5新规则：

新特性应该基于 HTML、CSS、DOM 以及 JavaScript。 减少对外部插件的需求（比如 Flash），更优秀的错误处理，更多取代脚本的标记，HTML5 应该独立于设备开发进程应对公众透明 ;

HTML5 新特性：

新的特殊内容元素，比如 article、footer等，新的表单控件，比如 calendar、date、time、email、url、search；用于媒介回放的 video 和 audio 元素；用于绘画的 canvas 元素

对本地离线存储的更好的支持。

Html5新增的标签有哪些？

新增的结构标签：

1、header元素

表示页面中一个内容区块或真个页面的标题。

2、hgroup元素

表示对真个页面或页面中的一个内容区块的标题进行组合。

3、article元素 

表示页面中一块与上下文不相关的独立内容。比如一篇文章。

4、aside元素

表示article元素内容之外的、与article元素内容相关的辅助信息。

5、footer元素

表示整个页面或页面中一个内容区块的脚注。一般来说，他会包含创作者的姓名、创作日期以及创作者的联系信息。

HTML5新规则：

新特性应该基于 HTML、CSS、DOM 以及 JavaScript。 减少对外部插件的需求（比如 Flash），更优秀的错误处理，更多取代脚本的标记，HTML5 应该独立于设备开发进程应对公众透明 ;

HTML5 新特性：

新的特殊内容元素，比如 article、footer等，新的表单控件，比如 calendar、date、time、email、url、search；用于媒介回放的 video 和 audio 元素；用于绘画的 canvas 元素 

对本地离线存储的更好的支持。

介绍几个常用的HTML5标签

一、Html的基本结构：

!DOCTYPE html

html

head

meta  charset=utf-8"

title/title

/head

body

网页的文本、图片等信息；

/body

/html

二、Head部分：用于表示网页的元数据即描述网页的基本信息

其常用标签及属性有：

1、title标签：浏览器标签页显示的标题

2、meta标签：其常用属性

①charset:设置文档的字符集编码格式。HTML5中设置字符集编码：meta charset="UTF-8"

常见的字符集编码格式：

a.GB-2312:国标码，简体中文

b.GBK：扩展的国标码

c.UTF-8：万国码 Unicode 常用

②http-equiv属性:将我们的信息写给浏览器看，让浏览器按照这里面的要求执行，可选属性值：Content-Type(文档类型) refresh(网页定时刷新) set-cookie(设置浏览器cookie缓存) 需要配合content属性使用。（http-equiv属性只是表明需要设置哪一部分，具体的设置内容，放到content属性中）

③name属性：使用方法同“http-equiv”。将我们的信息写给搜索引擎看

常用且需要掌握的属性值：author（作者） keywords（网页关键字） description（网页描述） 这两个属性设置，网页必不可少。

3、link标签：链接网页图标（title前的小logo），其常用属性有：

①rel属性：声明链接文件的类型，此处选icon

②type属性：可以省略

③href属性：表示图片的路径地址

三、body部分：网页的文本、图片等信息

标签的分类：

块级标签：显示为块，前后隔一行（自动换行）

行级标签：按行从左往右逐一显示。

1、 常见的块级标签：

①h1/h1......h6h6：标题标签，自动加粗，h1最大，h6最小。

②hr/：水平线标签，添加一条水平线。

③p/p:段落标签，

④br/:换行标签，

⑤blockquote//blockquote:引用标签，cite属性，表明引用的来源，一般引用网址

浏览器默认首行缩进。

⑥pre/pre:预格式标签，用于重载代码。浏览器默认显示样式：1、显示为等宽字体。 2、代码中的换行、

空格等元素能在浏览器中显示。

【补充】html 文件中空格的表示：nbsp;

2、 基于布局的块级标签

列表：无序列表、有序列表、定义列表

①有序列表：ol/ol 列表项：li/li

②无序列表：ul/ul 列表项：li/li

③定义列表（实现图文混排）:dl/dl

列表标题：dt一般只有一项/dt

列表描述项：dd可以有很多项/dd

3、组合标签：figure/figure用于显示图片及图片标题

他有两个子标签：img /图片

figcaption/figcaption图片的标题

例如：figure

img src="img/EZ.jpg" height="20%" width="20%" alt="探险家"/

figcaption探险家 伊泽瑞尔/figcaption

/figure

4、分区标签：div/div

5、常见的行级标签

1span（文本）:无实际意义，用于包裹某部分文字，修改特定样式，例如：

这是span style="color: red;font-size: 36px;"span/span中的文字

img（图片）：其常用属性：①src:表示引用图片的地址。

路径地址的写法：相对路径：以当前文件为最准，去寻找图片地址

a、与文件处于同一层的图片，直接写图片名

b、图片在当前文件下一层：文件名/图片名

c、图片在当前文件上一层：../图片名

绝对路径:盘符：/文件夹/图片名，但 是严禁使用

图片网址：网络上的图片链接，但是一般不用

②height和width：图片的高度和宽度。可以用CSS样式代替

③title：图片标。当鼠标指上之后显示的文字

④alt:当图片无法显示的时候，显示的文字

2em（倾斜强调）

3strong（加粗强调）

4b（加粗）

5i（倾斜）

Strong、em、b、i的区别

1、Strong、em都表示强调，Strong为粗体，em为斜体，而Strong的强调 程度逗比em高

2、Strong和b都能加粗，em和i都能倾斜，，但是Strong和em多了一层强调的语义 。H5要求标签尽可能实现语义化。

6q（短引用）

7small/big（缩小/放大字体）：small和big分别是缩小和扩大字体，都可以多层嵌套直至上限或下限

8a（超链接）

1、href:超链接的路径，可以是网络链接，也可以是本地文件。

2、target:跳转页面打开的位置。_self自身页面，_blank新页面。

3、title:鼠标指在超链接上显示的名称。

4、Rel（被链接是当前的前/后一篇）:指定被链接文档与当前文档的关系,搜索引擎 会利用该属性 获取更多的有关链接的信息：

rel="prev"被链接文档是当前文档的前一篇文 档，

rel="next"被链接文档是当前文档的后一篇文档,

rel="icon"被链接文档是当前文档的图标

rel="stylesheet"被链接文档是当前文档的样式表

5、Rev（当前是被链接的前/后一篇）

锚链接：

①本页面锚链接:a、设置锚点：a name="top"/a

b、跳转锚点：#name名

①页面间锚链接:a、在即将跳转页面的指定位置设置锚点

b、跳转锚点：页面地址.html#name名

a href="02_常见的块级标签.html#Hbuilder"页面间锚链接/abr/

功能性链接： mailto用于给指定邮箱发送邮件

file：///e:/aaa.png打开本地文件

tencent://message/?uin=1315618220 给指定QQ发送息

9s标签，有误文本：删除线

s这是S标签中的文字/sbr /

10cite标签：浏览器显示为倾斜，常用于书、画作、作品的引用

cite这是cite中的文本/citebr /

11code:计算机代码，不保留代码格式

pre

code/code

/pre

12bdo:表示文本方向，属性：dir="ltr"表示从左往右，dir="rtl"表示从右往左

bdo dir="rtl"1234567/bdobr /

kbd:表示需要用户用键盘输入的内容，浏览器显示为等宽字体

请输入“kbdEsc/kbd”推迟系统br /

13sup:上标文本，sub:下标文本

xsub6/subbr /

© copy; 空格 nbsp;

© copy; 空格 nbsp;br /

14u:下划线

u这是下划线/ubr /

mark:高亮或标记文本，浏览器显示为黄色背景

markmark/markbr /

html5新增标签都有哪些

html5新增标签大致如下：

canvas 新元素

canvas    标签定义图形，比如图表和其他图像。该标签基于 JavaScript 的绘图 API 

新多媒体元素

audio    定义音频内容  

video    定义视频（video 或者 movie）  

source    定义多媒体资源 video 和 audio  

embed    定义嵌入的内容，比如插件。  

track    为诸如 video 和 audio 元素之类的媒介规定外部文本轨道。 

新表单元素

datalist    定义选项列表。请与 input 元素配合使用该元素，来定义 input 可能的值。  

keygen    规定用于表单的密钥对生成器字段。  

output    定义不同类型的输出，比如脚本的输出。 

新的语义和结构元素

HTML5提供了新的元素来创建更好的页面结构：

article    定义页面独立的内容区域。  

aside    定义页面的侧边栏内容。  

bdi    允许您设置一段文本，使其脱离其父元素的文本方向设置。  

command    定义命令按钮，比如单选按钮、复选框或按钮  

details    用于描述文档或文档某个部分的细节  

dialog    定义对话框，比如提示框  

summary    标签包含 details 元素的标题  

figure    规定独立的流内容（图像、图表、照片、代码等等）。  

figcaption    定义 figure 元素的标题  

footer    定义 section 或 document 的页脚。  

header    定义了文档的头部区域  

mark    定义带有记号的文本。  

meter    定义度量衡。仅用于已知最大和最小值的度量。  

nav    定义导航链接的部分。  

progress    定义任何类型的任务的进度。  

ruby    定义 ruby 注释（中文注音或字符）。  

rt    定义字符（中文注音或字符）的解释或发音。  

rp    在 ruby 注释中使用，定义不支持 ruby 元素的浏览器所显示的内容。  

section    定义文档中的节（section、区段）。  

time    定义日期或时间。  

wbr    规定在文本中的何处适合添加换行符。  

初学者建议多访问下菜鸟教程：网页链接，都是比较全面的基础知识，可以看做编程词典，即使老司机也经常去查一些资料。

HTML5类标签

class类标签

定义和用法

class 属性规定元素的类名（classname）。

class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。

提示和注释

注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。

提示：可以给 HTML 元素赋予多个 class，例如：span class="left_menu important"。这么做可以把若干个 CSS 类合并到一个 HTML 元素。

提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。

实例