HTML5新增、删除、重定义标签

DOCTYPE声明,指示浏览器关于页面使用哪个HTML版本进行编写的指令。

HTML为什么不引用DTD? DTD是什么?

DTD(document type definition):可定义合法的XML文档构建模块,它使用一系列合法的元素来定义文档的结构。在HTML中,DTD规定了标记语言的规则,使浏览器能正确地呈现内容。HTML5不基于SGML,所以不需要引用DTD。

HTML5新增标签

1、结构标签(块状元素)——有意义的div

<artical> <header> <nav> <section> <aside> <hgroup> <figure> <figcaption> <footer> <dialog>

2、多媒体标签

1)<video>标记定义一个视频

2)<audio>标记定义一个音频

3)<source>标记定义媒体资源

4)<canvas>标记定义图片

5)<embed>标记定义外部的可交互的内容或插件,比如flash

多媒体标签的出现意味着富媒体的发展以及支持不使用插件的情况下即可操作媒体文件,极大地提升了用户体验。

3、web应用标签

状态标签

<meter> 实时状态显示:气压、气温

<progress> 任务过程:安装、加载

列表标签

<datalist> 为input标签定义一个下拉列表,配合option

<details> 标记定义一个元素的详细内容,配合summary

4、其他标签

注释标签

<ruby> 标记定义注释或音标

<rt> 标记定义对ruby的注释内容文本

<rp> 告诉那些不支持ruby元素的浏览器如何去显示

<mark> 标记定义有标记的文本(黄色选中状态)

<output> 标记定义一些输出类型,计算表单结果配合oninput事件

删除的标签

1、纯表现的元素

Basefont  big  center  font  s  strike  tt  u

2、对可用性产生负面影响的元素

frame  frameset  noframes  

3、产生混淆的元素

acronym  applet  isindex  dir

重定义标签

显示不变,只是表达的含义进行了重新定义的标签

 

html5属性变化

input新增类型

autocomplete属性

form或input域应该拥有自动完成功能

<form autocomplete="on"> </form>

autocomplete适用于<form>标签,以及以下类型的<input>标签:text,search,url,tel,email,password,datepickers,range,color.

autofocus属性

规定在页面加载时,域自动地获得焦点

适用于所有的<input>标签的类型 <input autofocus="autofocus"/>

multiple属性

规定输入域中可选择多个值

multiple属性适用于以下类型的input标签:email 和 file

<input type="file" multiple="multiple" />

表单新增属性

placeholder属性

提供一种提示(hint),描述输入域所期待的值

<input type="search" placeholder="Search Content"/>

适用于<input>标签type属性值为:text search url tel email password

required属性

规定必须在提交之前填写输入域(不能为空)

<input type="text" requried="required" />

能够减少前端开发人员写表单验证的压力

适用于<input>标签type属性值为:text search url tel email password datepickers number checkbox radio file

其他标签属性

链接属性

sizes

<link rel="sytlesheet" href="CSS文件的url" type="text/css" />

<link rel="icon" href="icon.gif" type="image/gif" sizes="16*16" >插入图片,可控制像素大小

target

<base href="http://localhost/" target="_blank" >

base标签写在head标签之内。target属性可以控制整个页面所有超链接的跳转方式,href规定页面中所有相对链接的基准 URL;

<base>标签没有sizes属性;

超链接

a:media=""(表示对设备进行优化,handheld对“手持”设备进行支持,tv对”电视“设备进行支持);

a:hreflang="zh"(设置语言,这里设置语言是中文)

a:rel="external"(设置超链接的引用,这里超链接为外部链接)

script

<script> 标签用于定义客户端脚本;

defer

加载完脚本后并不执行,而是等整个页面加载完之后再执行,只兼容ie

<scrip defer src="URL" ></script>

defer规定是否对脚本执行进行延迟,直到页面加载为止;

async

加载完脚本后立刻执行,不用等整个页面都加载完,属于异步执行,兼容主流浏览器

<script async src =“URL" ></script>

async属性规定对脚本进行异步加载,实现JavaScript双线程加载;

ol有序列表新增加的属性

start——设置序号的起始值

reversed——倒叙排列

html

<html manifest="文件名.manifest">  定义页面离线应用文件

假设有三个文件 index.html index.css index.js ,在连网时能正常访问,不连网时不能加载页面。使用manifest属性后,连网时将这三个文件放到本地,在断网情况下依然能正常显示网页。

style

scoped:内嵌CSS,可以写在任何位置,里面也CSS代码

<style scoped>

...

<style>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值