html5变动标签新写法,Html5新标签解释及用法

最新推荐文章于 2024-03-24 19:44:07 发布
最新推荐文章于 2024-03-24 19:44:07 发布
阅读量148 收藏
点赞数
文章标签： html5变动标签新写法
本文介绍了HTML5新增的标签及其用途，包括定义外部内容的<blockquote>、与文档相关但可独立的<aside>、音频<audio>和图形<canvas>等。探讨了这些标签如何改善网页结构和用户体验。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

Html5新标签解释及用法

发布时间：2012-02-17 22:50:45   作者：佚名   text-message.png 我要评论

HTML 5 是一个新的网络标准，目标在于取代现有的 HTML 4.01, XHTML 1.0 and DOM Level 2 HTML 标准

它希望能够减少浏览器对于需要插件的丰富性网络应用服务(plug-in-based rich internet application，RIA)，如Adobe Flash, Microsoft Silverlight, 与 Sun JavaFX 的需求。

HTML 5 提供了一些新的元素和属性，反映典型的现代用法网站。其中有些是技术上类似

和 标签，但有一定含义，例如 (网站导航块)和 。这种标签将有利于搜索引擎的索引整理、小屏幕装置和视障人士使用。同时为其他浏览要素提供了新的功能，通过一个标准接口，如 和 标记。

一些过时的 HTML 4 标记将取消，其中包括纯粹用作显示效果的标记，如 和

，因为它们已经被 CSS 取代。还有一些透过 DOM 的网络行为(via)。

下面我们来看一下HTML 5提供的一些新的标签用法以及和HTML 4的区别。

标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。

HTML5:

HTML4:

标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。

HTML5:Aside 的内容是独立的内容，但应与文档内容相关。

HTML4:

Aside 的内容是独立的内容，但应与文档内容相关。

标签定义声音，比如音乐或其他音频流。

HTML5:您的浏览器不支持 audio 标签。

HTML4:

标签定义图形，比如图表和其他图像。这个 HTML 元素是为了客户端矢量图形而设计的。它自己没有行为，但却把一个绘图 API 展现给客户端 JavaScript 以使脚本能够把想绘制的东西都绘制到一块画布上。

HTML5:

HTML4:

标签定义命令按钮，比如单选按钮、复选框或按钮。

HTML5:

HTML4: none

标签定义可选数据的列表。与 input 元素配合使用，就可以制作出输入值的下拉列表。

HTML5:

HTML4: see combobox.

标签定义元素的细节，用户可进行查看，或通过点击进行隐藏。与 一起使用，来制作 detail 的标题。该标题对用户是可见的，当在其上点击时可打开或关闭 detail。

HTML5:

HTML4:

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

HTML5:

HTML4:

标签定义 figure 元素的标题。”figcaption” 元素应该被置于 “figure” 元素的第一个或最后一个子元素的位置。

HTML5:

PRC

HTML4: none

标签用于对元素进行组合。使用
元素为元素组添加标题。

HTML5:

PRC

The People's Republic of China was born in 1949...

HTML4:

PRC

The People's Republic of China was born in 1949...

标签定义 section 或 document 的页脚。典型地，它会包含创作者的姓名、文档的创作日期以及/或者联系信息。

HTML5:

HTML4:

标签定义 section 或 document 的页眉。

HTML5:

HTML4:

标签用于对网页或区段(section)的标题进行组合。

HTML5:

HTML4:

标签定义生成密钥。

HTML5:

HTML4: none

主要用来在视觉上向用户呈现那些需要突出的文字。标签的一个比较典型的应用就是在搜索结果中向用户高亮显示搜索关键词。

HTML5:

HTML4:

标签定义度量衡。仅用于已知最大和最小值的度量。必须定义度量的范围，既可以在元素的文本中，也可以在 min/max 属性中定义。

HTML5:

HTML4: none

标签定义导航链接的部分。

HTML5:

HTML4:

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

HTML5:

HTML4:

标签运行中的进程。可以使用 标签来显示 JavaScript 中耗费时间的函数的进程。

HTML5:

HTML4: none

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

HTML5: 漢 (ㄏㄢˋ)

HTML4: none

标签定义字符(中文注音或字符)的解释或发音。

HTML5: 漢 ㄏㄢˋ

HTML4: none

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

HTML5: 漢 (ㄏㄢˋ)

HTML4: none

标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。

HTML5:

HTML4:

标签为媒介元素(比如 和 )定义媒介资源。

HTML5:

HTML4:

标签包含 details 元素的标题，”details” 元素用于描述有关文档或文档片段的详细信息。”summary” 元素应该是 “details” 元素的第一个子元素。

HTML5: HTML 5This document teaches you everything you have to learn about HTML 5.

HTML4: none

标签定义日期或时间，或者两者。

HTML5:

HTML4:

标签定义视频，比如电影片段或其他视频流。

HTML5: 您的浏览器不支持 video 标签。

HTML4:

相关文章

这篇文章主要为大家介绍了html5各种页面切换效果和模态对话框用法总结,较为详细的介绍了HTML5的各种页面元素的使用技巧,非常具有实用价值,需要的朋友可以参考下2014-12-15

这篇文章主要为大家介绍了HTML5中drawImage用法分析及实际应用中遇到的问题与解决方法,分析了错误代码与修改后的代码,加深对HTML5具体应用的理解,需要的朋友可以参考下2014-12-01

这篇文章主要介绍了HTML5 embed标签定义和用法，需要的朋友可以参考下2014-05-09

这篇文章主要介绍了HTML5本地存储localStorage、sessionStorage基本用法、遍历操作、异常处理等,需要的朋友可以参考下2014-05-08

html5基础，包括html5视频标签和html5新标签等标签用法，大家参考使用吧2013-12-30

本文是对html5跨域通讯之postMessage的用法进行了详细的总结介绍，需要的朋友可以过来参考下，希望对大家有所帮助2013-11-07

本文是小编给大家收藏整理的关于常见的6种HTML5错误用法，非常不错，具有参考借鉴价值，需要的朋友参考下吧2017-11-06

最新评论

HTML滑动条自动滑动,HTML5新特性——自定义滑动条（input[type="range"]）
weixin_32211599的博客
05-30 3100
HTML 4.01 与 HTML5之间的差异以下 input 的 type属性值是 HTML5 中新增的：color、date、datetime、datetime-local、month、week、time、email、number、range、search、tel 和 url。input的type属性设置input的type="range"即可得到滑动条控件，如下：const range = d...
HTML5andCSS3面试题大全
donglize521521的博客
03-08 6055
文章目录1.CSS引入(1)有哪些引入方式？通过link和@import引入有什么区别？（* ）(2)Style 标签写在 body 后和 body 前有什么区别？(3)什么是 FOUC(Flash of Unstyled Content)？如何来避免 FOUC2.CSS选择器(1) CSS选择器种类(2)CSS选择器的优先级3.CSS伪类和伪元素4.CSS盒模型4.有哪些方式（CSS）可以隐藏页面元素？4.**em\px\rem区别？****5.块级元素水平居中的方法？** 1.CSS引入 (1)有哪些引
JavaScript 关闭页面窗户
04-16
<html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> 关闭 [removed] var btn = document.getElementById('btn') btn.onclick = function () { if (confirm()) { window.close() } } [removed] </body> </html>
html5退出页面,HTML5页面CSS Reset
weixin_34711401的博客
06-05 285
/*------------------*//*reset*//*------------------*/* {box-sizing: border-box; -webkit-tap-highlight-color: rgba(0,0,0,0);}html {font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;-...
html5 新标签支持js写法
齐枫的博客
10-24 1462
先上代码  用js创建新的标签元素，使ie支持html5新标签 <!-- (function() { if (! /*@cc_on!@*/ 0) return; var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure
用canvas标签实现网页H5动态时钟
No Back丶的博客
08-13 1548
用canvas标签实现网页H5动态时钟
JavaScript入门（五） - 关闭窗口（window.close）
goldmei一枝梅的专栏
11-24 1357
html lang="en"> head> meta charset="UTF-8"> title>关闭窗口title> script type="text/javascript"> /* close()关闭窗口 用法： window.close(); //关闭本窗口 或
php5新改动之短标记启用方法
01-20
从PHP5版本开始，语言中的一些特性发生了改变，其中短标记（short open tag）的启用方法就经历了变动。短标记是指PHP中的简写形式… ?>，它能够用于开始和结束PHP代码段。在早期的PHP版本中，默认允许使用这种简写...
5 Vue＋html css 问题（西安10.9）
harvestUachieve的博客
10-10 1526
数据响应式原理的核心就是采用了数据劫持结合发布者-订阅者模式的方式来实现数据的响应式,通过Object.defineProperty()对数据进行拦截，把这些属性全部转换成getter/setter，get（）方法可以读取数据、收集依赖，set（）方法可以改写数据，在数据变动时会对数据进行比较，如果数据发生了变化，会发布消息通知订阅者，触发监听回调，更新视图。watch监听的数据必须是data中声明过或父组件传递过来的props中的数据，当数据变化时，触发监听器。的操作，比如改变宽高，隐藏节点等。
HTML5 + CSS3面试题整理
热门推荐
计算机源码之家的博客
09-29 1万+
...
页面关闭事件-锚事件
aliven1的博客
01-30 497
window.onhashchange onhashchange 事件在当前 URL 的锚部分(以 '#' 号为开始) 发生改变时触发 。 锚部分的实例：指定当前 URL 为 http://www.example.com/test.htm#part2 - 这个 URL 中的锚部分为 #part2。 你可以使用以下方式调用事件: 通过设置Location 对象的location.hash或location.href属性修改锚部分。 使用不同书签导航到当前页面（使用"后退" 或"前进"按钮）...
前端学习＜一＞HTML——07-html标签图文详解（二）
——心比天高，仗剑走天涯，保持热爱，奔赴向梦想！低调，谦虚，自律，反思，成长，还算是比较正能量的博主，公益免费传播……内心特别想在AI界做出一些可以推进历史进程影响力的东西(兴趣使然，有点小情怀，也有点使命感呀)…
03-24 1958
知道每个标签的特殊用法、属性。比如a标签，img的属性。
H5关闭当前页面，包括微信浏览器
每天都要努力学习哦~~
10-27 5925
用户代理字符串是浏览器发送给服务器的一部分信息，其中包含了关于浏览器类型和版本的信息。这段代码是一个JavaScript函数，用于关闭当前页面的操作。window.close()方法只能关闭由window.open()或者浏览器直接输入url打开的页面，其余情况安全考虑是被限制的。时，浏览器会关闭最前面的窗口，无论是不是你的脚本创建的这个窗口。的值为 "close_window:ok"，表示关闭成功，会打印"关闭成功的处理"。作为参数，以及一个回调函数，用于处理关闭窗口的结果。的值来判断关闭窗口的结果。
HTML5页面（php）——退出界面
_囡囡吖_的博客
08-15 1317
php学生信息综合管理系统——退出界面 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>用户退出—综合信息管理系统</title> <style type="t...
h5页面如何实现阻止关闭页面,或阻止刷新页面
yun_master的博客
03-27 3709
页面拦截(beforeunload事件) window.addEventListen(“beforeunload”,(e) => { const message = '即将离开当前页面,确认吗??' e.returnValue = message; return message; })
HTML（3）块级元素、内联元素、可变元素
ADreamClusive的博客
05-09 1966
块元素(block element)和内联元素(inline element)都是html规范中的概念。块元素和内联元素的基本差异是块元素一般都从新行开始。而当加入了css控制以后，块元素和内联元素的这种属 性差异就不成为差异了。比如，我们完全可以把内联元素cite加上display:block这样的属性，让他也有每次都从新行开始的属性。 1 块级元素 块元素一般都从新行开始，它可以容
html5怎么弄动态,HTML5怎么动态添加元素
weixin_42422285的博客
06-07 267
满意答案plae1247402017.02.06采纳率：55%等级：9已帮助：167人用js 参考一下这个代码window.onload=function () {var Odiv=document.createElement("div"); //创建一个divvar Ospan=document.createElement("span"); //...
html5：<canvas>标签实现动态效果
xuanbin303的博客
02-28 2006
new document         var canvas =document.getElementById('canvas'); var context=canvas.getContext('2d'); var x=-300; //八卦 context.translate(canvas.width/2,canvas.height/2); setInt
vue2使用jsx写法不如template写法
最新发布
03-25
### Vue2 中 JSX 写法与 Template 写法的区别及性能对比 #### 一、语法结构差异 在 Vue2 中，`JSX` 和 `Template` 是两种不同的模板定义方式。 - **Template** 使用 HTML-like 的字符串来描述 UI 层级关系，适合...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值