详解HTML5新增标签


Posted in HTML / CSS onNovember 27, 2017

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 提供了一些新的元素和属性,反映典型的现代用法网站。其中有些是技术上类似和 标签,但有一定含义,例如

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

<header style="text-align: center; color: blue;">欢迎来到Html5的学习之路,我是header标签。</header>

这是一个定义选项列表的标签datalist 这个的作用就是将text文本框与select标签结合起来

<input type="text" list="phone">
<datalist id="phone">
    <option></option>
    <option>IPhone</option>
    <option>华为 </option>
    <option>小米 </option>
    <option>三星</option>
</datalist>    
<font color="red">这里我发现了两者一个不同之处在于,datalist只有在输入框为空的时候才会有自己定义下拉的内容!</font>
<br/>

而这个select选项框是不管什么内容它都会存在的

<select>
<option>IPhone</option>
<option>华为 </option>
<option>小米 </option>
<option>三星</option>
</select>
------------------------
<br><br><br>

这是一个定义文档细节的标签。detail标签。它的主要作用很简单。

<details>
<summary>这是一个detail标签,下面就是他的使用方法</summary>
<p>detail标签是什么?</p>
<p>detail标签有什么作用?</p>
<p>detail标签能干什么?</p>
<p>detail标签我改怎么用它?</p>
</details>
<br>
detail标签常与sunmmary标签用在一起。比如这个标签是高亮标签<mark>mark</mark>比重不一样。
<br><br>

接下来这个标签是定义列表标签。menu。

<menu>
    <li>西游记</li><li>水浒传</li><li>红楼梦</li><li>三国演义</li>
</menu>
<br><br>

进度条标签我们用的比较多。比如这个。

<mark>progress</mark>
<progress value="5" max="10">value=5 max=10</progress>
<br>
<audio src="" controls="controls" autoplay="autoplay" loop="loop"></audio>
<footer>我是底部footer标签</footer>

总结

以上所述是小编给大家介绍的HTML5新增标签,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

HTML / CSS 相关文章推荐
纯CSS3代码实现switch滑动开关按钮效果
Aug 30 HTML / CSS
css3实现波纹特效、H5实现动态波浪效果
Jan 31 HTML / CSS
CSS3 制作绽放的莲花采用效果叠加实现
Jan 31 HTML / CSS
css 省略号 css3让多余的字符串消失并附加省略号的实现代码
Feb 07 HTML / CSS
CSS的background属性及CSS3的背景图片设置总结
Jun 13 HTML / CSS
CSS3动画:5种预载动画效果实例
Apr 05 HTML / CSS
CSS3 实现飘动的云朵动画
Dec 01 HTML / CSS
HTML5所有标签汇总及标签意义解释
Mar 12 HTML / CSS
详解HTML5中rel属性的prefetch预加载功能使用
May 06 HTML / CSS
浅谈HTML5中dialog元素尝鲜
Oct 15 HTML / CSS
VSCode 自定义html5模板的实现
Dec 05 HTML / CSS
HTML页面点击按钮关闭页面的多种方式
Dec 24 HTML / CSS
详解HTML5中垂直上下居中的解决方案
Dec 20 #HTML / CSS
HTML5混合开发二维码扫描以及调用本地摄像头
Dec 27 #HTML / CSS
HTML5实现Notification API桌面通知功能
Mar 02 #HTML / CSS
HTML5 canvas实现雪花飘落特效
Mar 08 #HTML / CSS
HTML5 用动画的表现形式装载图像
Mar 08 #HTML / CSS
HTML5离线缓存Manifest是什么
Mar 09 #HTML / CSS
html5 touch事件实现触屏页面上下滑动(一)
Mar 10 #HTML / CSS
You might like
php面向对象全攻略 (十六) 对象的串行化
2009/09/30 PHP
PHP设置一边执行一边输出结果的代码
2013/09/30 PHP
php实现下载限制速度示例分享
2014/02/13 PHP
JS异常处理try..catch语句的作用和实例
2014/05/05 PHP
利用PHP将部分内容用星号替换
2020/04/21 PHP
[原创]php token使用与验证示例【测试可用】
2017/08/30 PHP
浅谈PHP实现大流量下抢购方案
2017/12/15 PHP
用JTrackBar实现的模拟苹果风格的滚动条
2007/08/06 Javascript
PHP 与 js的通信(via ajax,json)
2010/11/16 Javascript
使用jquery animate创建平滑滚动效果(可以是到顶部、到底部或指定地方)
2014/05/27 Javascript
Js实现自定义右键行为
2015/03/26 Javascript
arguments对象验证函数的参数是否合法
2015/06/26 Javascript
jquery自定义右键菜单、全选、不连续选择
2016/03/01 Javascript
一个手写的vue放大镜效果
2019/08/09 Javascript
layui 富文本编辑器和textarea值的相互传递方法
2019/09/18 Javascript
JS实现点星星消除小游戏
2020/03/24 Javascript
[42:27]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第三局
2016/03/05 DOTA
[04:48]DOTA2亚洲邀请赛林书豪为VGJ加油
2017/04/01 DOTA
[45:15]Optic vs VP 2018国际邀请赛淘汰赛BO3 第一场 8.24
2018/08/25 DOTA
给Python中的MySQLdb模块添加超时功能的教程
2015/05/05 Python
python文件的md5加密方法
2016/04/06 Python
Python爬虫设置代理IP的方法(爬虫技巧)
2018/03/04 Python
python如何统计序列中元素
2020/07/31 Python
Python使用min、max函数查找二维数据矩阵中最小、最大值的方法
2018/05/15 Python
Python重新加载模块的实现方法
2018/10/16 Python
python使用Paramiko模块实现远程文件拷贝
2019/04/30 Python
python django中8000端口被占用的解决
2019/12/17 Python
Python下划线5种含义代码实例解析
2020/07/10 Python
css3中背景尺寸background-size详解
2014/09/02 HTML / CSS
销售团队口号大全
2014/06/06 职场文书
高中生旷课检讨书
2014/10/08 职场文书
2014年幼儿园后勤工作总结
2014/11/10 职场文书
2014年乡镇人大工作总结
2014/11/25 职场文书
2015年化工厂工作总结
2015/05/04 职场文书
Python获取字典中某个key的value
2022/04/13 Python
mysql序号rownum行号实现方式
2022/12/24 MySQL