H5的新特性

增加的标签:
 在body中,能添加一个<article>
<article> 标签规定独立的自包含内容。
一篇文章应有其自身的意义,应该有可能独立于站点的其余部分对其进行分发。
<article> 元素的潜在来源:
论坛帖子
报纸文章
博客条目
用户评论


 在body中,能添加一个<aside>
<aside> 的内容可用作文章的侧栏。


 在body中,能添加一个<audio>
<audio> 标签定义声音,比如音乐或其他音频流。
可以在开始标签和结束标签之间放置文本内容,这样老的浏览器就可以显示出不支持该标签的信息。


 在body中,能添加一个<bdi>
(有属性dir 其值为ltr   rtl   auto   默认值:auto。)
bdi 指的是 bidi 隔离。
<bdi> 标签允许您设置一段文本,使其脱离其父元素的文本方向设置。
在发布用户评论或其他您无法完全控制的内容时,该标签很有用。


 在body中,能添加一个<canvas>
(height pixels 设置 canvas 的高度。)
(width pixels 设置 canvas 的宽度。)
<canvas> 标签定义图形,比如图表和其他图像。
<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。


 在body中,能添加一个<command>
属性 描述
checked checked 定义是否被选中。仅用于 radio 或 checkbox 类型。
disabled disabled 定义 command 是否可用。
icon url 定义作为 command 来显示的图像的 url。
label text 为 command 定义可见的 label。
radiogroup groupname 定义 command 所属的组名。仅在类型为 radio 时使用。
type checkbox,command,radio 定义该 command 的类型。默认是 "command"。
command 元素表示用户能够调用的命令。
<command> 标签可以定义命令按钮,比如单选按钮、复选框或按钮。
只有当 command 元素位于 menu 元素内时,该元素才是可见的。否则不会显示这个元素,但是可以用它规定键盘快捷键。

 在body中,能添加一个<datalist>
<datalist> 标签定义选项列表。请与 input 元素配合使用该元素,来定义 input 可能的值。
datalist 及其选项不会被显示出来,它仅仅是合法的输入值列表。
请使用 input 元素的 list 属性来绑定 datalist。


 在body中,能添加一个<details>
(属性open 值open 定义 details 是否可见。)
<details> 标签用于描述文档或文档某个部分的细节。
 
 在body中,能添加一个<dialog>
(属性open 值open 规定 dialog 元素是活动的,用户可与之交互。)
<dialog> 标签定义对话框或窗口。


 在body中,能添加一个<embed>
属性 描述
height pixels 设置嵌入内容的高度。
src url 嵌入内容的 URL。
type type 定义嵌入内容的类型。
width pixels 设置嵌入内容的宽度。
<embed> 标签定义嵌入的内容,比如插件。
 
 在body中,能添加一个<figcaption>
<figcaption> 标签定义 figure 元素的标题(caption)。
"figcaption" 元素应该被置于 "figure" 元素的第一个或最后一个子元素的位置。


 在body中,能添加一个<figure>
请使用 <figcaption> 元素为 figure 添加标题(caption)。
<figure> 标签规定独立的流内容(图像、图表、照片、代码等等)。
figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。


 在body中,能添加一个<footer>
<footer> 标签定义文档或节的页脚。
<footer> 元素应当含有其包含元素的信息。
页脚通常包含文档的作者、版权信息、使用条款链接、联系信息等等。
您可以在一个文档中使用多个 <footer> 元素。
<footer> 元素内的联系信息应该位于 <address> 标签中。


 在body中,能添加一个<header>
<header> 标签定义文档的页眉(介绍信息)。


 在body中,能添加一个<keygen>
属性 描述
autofocus autofocus 使 keygen 字段在页面加载时获得焦点。
challenge challenge 如果使用,则将 keygen 的值设置为在提交时询问。
disabled disabled 禁用 keytag 字段。
form formname 定义该 keygen 字段所属的一个或多个表单。
keytype rsa 定义 keytype。rsa 生成 RSA 密钥。
name fieldname 定义 keygen 元素的唯一名称。 name 属性用于在提交表单时搜集字段的值。
<keygen> 标签规定用于表单的密钥对生成器字段。
当提交表单时,私钥存储在本地,公钥发送到服务器。
 
 在body中,能添加一个<mark>
<mark> 标签定义带有记号的文本。请在需要突出显示文本时使用 <m> 标签。
 
 在body中,能添加一个<meter> 
属性 描述
form form_id 规定 <meter> 元素所属的一个或多个表单。
high number 规定被视作高的值的范围。
low number 规定被视作低的值的范围。
max number 规定范围的最大值。
min number 规定范围的最小值。
optimum number 规定度量的优化值。
value number 必需。规定度量的当前值。


<meter> 标签定义已知范围或分数值内的标量测量。也被称为 gauge(尺度)。
例子:磁盘用量、查询结果的相关性,等等。
注释:<meter> 标签不应用于指示进度(在进度条中)。如果标记进度条,请使用 <progress> 标签。


 在body中,能添加一个<nav>
<nav> 标签定义导航链接的部分。
如果文档中有“前后”按钮,则应该把它放到 <nav> 元素中。


 在body中,能添加一个<output> 
属性 描述
for element_id 定义输出域相关的一个或多个元素。
form form_id 定义输入字段所属的一个或多个表单。
name name 定义对象的唯一名称。(表单提交时使用)
<output> 标签定义不同类型的输出,比如脚本的输出。
 
 在body中,能添加一个<progress>
属性 描述
max number 规定任务一共需要多少工作。
value number 规定已经完成多少任务。
<progress> 标签标示任务的进度(进程)。
请结合 <progress> 标签与 JavaScript 一同使用,来显示任务的进度。
<progress> 标签不适合用来表示度量衡(例如,磁盘空间使用情况或查询结果)。如需表示度量衡,请使用 <meter> 标签代替。
 
 在body中,能添加一个<rp>
<rp> 标签在 ruby 注释中使用,以定义不支持 ruby 元素的浏览器所显示的内容。
ruby 注释是中文注音或字符。
在东亚使用,显示的是东亚字符的发音。
与 <ruby> 以及 <rt> 标签一同使用:
ruby 元素由一个或多个字符(需要一个解释/发音)和一个提供该信息的 rt 元素组成,还包括可选的 rp 元素,定义当浏览器不支持 "ruby" 元素时显示的内容。
 
 在body中,能添加一个<rt>
<rt> 标签定义字符(中文注音或字符)的解释或发音。
ruby 注释是中文注音或字符。
在东亚使用,显示的是东亚字符的发音。
与 <ruby> 以及 <rt> 标签一同使用:
ruby 元素由一个或多个字符(需要一个解释/发音)和一个提供该信息的 rt 元素组成,还包括可选的 rp 元素,定义当浏览器不支持 "ruby" 元素时显示的内容。
 
 在body中,能添加一个<ruby>
<ruby> 标签定义 ruby 注释(中文注音或字符)。
在东亚使用,显示的是东亚字符的发音。
与 <ruby> 以及 <rt> 标签一同使用:
ruby 元素由一个或多个字符(需要一个解释/发音)和一个提供该信息的 rt 元素组成,还包括可选的 rp 元素,定义当浏览器不支持 "ruby" 元素时显示的内容。
 
 在body中,能添加一个<section>
(属性cite 值URL section 的 URL,假如 section 摘自 web 的话。)
<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。


 在body中,能添加一个<source>
属性 描述
media media query 规定媒体资源的类型。
src url 规定媒体文件的 URL。
type numeric value 规定媒体资源的 MIME 类型。
<source> 标签为媒介元素(比如 <video> 和 <audio>)定义媒介资源。
<source> 标签允许您规定可替换的视频/音频文件供浏览器根据它对媒体类型或者编解码器的支持进行选择。


 在body中,能添加一个<summary> 
<summary> 标签包含 details 元素的标题,"details" 元素用于描述有关文档或文档片段的详细信息。
请与 <details> 标签一起使用。标题是可见的,当用户点击标题时会显示出详细信息。
"summary" 元素应该是 "details" 元素的第一个子元素。


 在body中,能添加一个<time>
属性 描述
datetime datetime 规定日期 / 时间。否则,由元素的内容给定日期 / 时间。
pubdate pubdate 指示 <time> 元素中的日期 / 时间是文档(或 <article> 元素)的发布日期。
<time> 标签定义公历的时间(24 小时制)或日期,时间和时区偏移是可选的。
该元素能够以机器可读的方式对日期和时间进行编码,这样,举例说,用户代理能够把生日提醒或排定的事件添加到用户日程表中,搜索引擎也能够生成更智能的搜索结果。


 在body中,能添加一个<track>
属性 描述
default default 规定该轨道是默认的,假如没有选择任何轨道。
kind captions,chapters,descriptions,metadata,subtitles         表示轨道属于什么文本类型。
label label 轨道的标签或标题。
src url 轨道的 URL。
srclang language_code 轨道的语言,若 kind 属性值是 "subtitles",则该属性必需的。
<track> 标签为诸如 video 元素之类的媒介规定外部文本轨道。
用于规定字幕文件或其他包含文本的文件,当媒介播放时,这些文件是可见的。




 在body中,能添加一个<video>
属性 描述
autoplay autoplay 如果出现该属性,则视频在就绪后马上播放。
controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性,则当媒介文件完成播放后再次开始播放。
muted muted 规定视频的音频输出应该被静音。
poster URL 规定视频下载时显示的图像,或者在用户点击播放按钮前显示的图像。
preload preload 如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。
<video> 标签定义视频,比如电影片段或其他视频流。
可以在开始标签和结束标签之间放置文本内容,这样老的浏览器就可以显示出不支持该标签的信息。


 在body中,能添加一个<wbr>
Word Break Opportunity (<wbr>) 规定在文本中的何处适合添加换行符。
如果单词太长,或者您担心浏览器会在错误的位置换行,那么您可以使用 <wbr> 元素来添加 Word Break Opportunity(单词换行时机)。
 
 
HTML全局属性
 能添加一个contenteditable
描述
true 规定元素可编辑。
false 规定元素不可编辑。
语法<element contenteditable="true|false">
contenteditable 属性规定元素内容是否可编辑。
注释:如果元素未设置 contenteditable 属性,那么元素会从其父元素继承该属性。


 能添加一个contextmenu
值menu_id 要打开的 <menu> 元素的 id。
语法<element contextmenu="menu_id">
contextmenu 属性规定元素的上下文菜单。当用户右键点击元素时,会出现上下文菜单。
contextmenu 属性的值是要打开的 <menu> 元素的 id。


 能添加一个data-*
值somevalue 规定属性的值(以字符串)。
语法<element data-*="somevalue">
data-* 属性用于存储页面或应用程序的私有自定义数据。
data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。
存储的(自定义)数据能够被页面的 JavaScript 中利用,以创建更好的用户体验(不进行 Ajax 调用或服务器端数据库查询)。
data-* 属性包括两部分:
属性名不应该包含任何大写字母,并且在前缀 "data-" 之后必须有至少一个字符
属性值可以是任意字符串
注释:用户代理会完全忽略前缀为 "data-" 的自定义属性。


 能添加一个draggable
描述
true 规定元素的可拖动的。
false 规定元素不可拖动。
auto 使用浏览器的默认行为。
语法<element draggable="true|false|auto">
draggable 属性规定元素是否可拖动。
链接和图像默认是可拖动的。
draggable 属性常用在拖放操作中。请在我们的拖放教程中学习更多内容。


 能添加一个dropzone
描述
copy 拖动数据会产生被拖动数据的副本。
move 拖动数据会导致被拖动数据被移动到新位置。
link 拖动数据会产生指向原始数据的链接。
语法<element dropzone="copy|move|link">
dropzone 属性规定在元素上拖动数据时,是否拷贝、移动或链接被拖动数据。


 能添加一个hidden
语法<element hidden>
hidden 属性是布尔属性。
如果设置该属性,它规定元素仍未或不再相关。
浏览器不应显示已规定 hidden 属性的元素。
hidden 属性也可用于防止用户查看元素,直到匹配某些条件(比如选择了某个复选框)。然后,JavaScript 可以删除 hidden 属性,以使此元素可见。
 
 能添加一个spellcheck
描述
true 对元素进行拼写和语法检查
false 不检查元素。
语法<element spellcheck="true|false">
spellcheck 属性规定是否对元素进行拼写和语法检查。
可以对以下内容进行拼写检查:
input 元素中的文本值(非密码)
<textarea> 元素中的文本
可编辑元素中的文本


 能添加一个translate
描述
yes 规定应该翻译元素内容。
no 规定不应翻译元素内容。
语法<element translate="yes|no">
translate 规定是否应该翻译元素内容。
请使用 class="notranslate" 替代。
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值