对HTML5开发技术感兴趣的朋友知道HTML5的文档类型吗？我相信我的大多数朋友都有一个简单的HTML5文档类型：DOCTYPE html是众所周知的，这意味着浏览器将根据标准模式进行解析。今天，边肖带读者去了解HTML5新特性的语义标签。感兴趣的朋友会过来和边肖一起看看。

简洁的DOCTYPE：

HTML5只有一种简单的文档类型：DOCTYPE html，这意味着浏览器将根据标准模式进行解析。

简单易记的编码类型：

您现在可以在元标签中使用“字符集”

脚本和链接无需type:

link rel='样式表' href='路径/到/样式表. CSS '/脚本src='路径/到/脚本. js '/脚本

更加语义化的新增标签:

例如：文章、部分、侧边、组、页眉、页脚、导航、时间、标记、图形和图形标题等。

视频和音频：

录像

宽度='640 '高度='320 '预载='自动'海报='0.jpg '控件

source src=' movie . ogg ' type=' video/ogg '/source

src='movie.mp4 '类型='video/mp4' /您的浏览器不支持

视频标签。/视频

表单增强：

新的输入类型：颜色、电子邮件、日期、月、周、时间、日期时间、本地日期时间、数字、范围、搜索、电话和url

新属性：必需、自动对焦、模式、列表、自动完成和占位符

新元素：关键字、数据表、输出、仪表和进度

画布标签绘制2D图形。

定义变量

canvas=document . getelementbyid(' canvas ')；var上下文=

canvas . GetContext(' 2d ')；context.beginPathcontext.moveTo(100，100)；context.lineTo(300，300)；context.lineTo(100，500)；上下文线宽

=5;context.strokeStyle=' redcontext.stroke

地理位置获取

HTML语义化

1.什么是HTML语义化？

通过标签判断内容语义，比如根据h1标签判断内容为标题，根据P判断内容为段落，输入标签为输入框等。

2.为什么要语义化？

1).当样式被移除或丢失时，页面可以呈现清晰的结构

2)方便其他设备(如屏幕阅读器、盲人阅读器、移动设备)以有意义的方式呈现网页

3).有利于SEO

4)易于团队开发和维护，遵循W3C标准，减少差异

3.如何确定你的标签是否语义良好？

删除样式，看看网页结构是否组织良好，仍然可读。

4.常见的语义化标签模块

菜单

形式

action=' method=' field set style=' border : none '

图例样式='display: none '登录表单/图例

Plabel for='name '帐号：/labeinput type=' text '

id='name'/p plabel

for=' pw ' password://labelinput type=' password '

id=' pw '/p input type=' submit ' name=' log in '

class='subBtn' /fieldset/form

表单域要用fieldset标签包装，表单的用途要用图例标签说明；每个输入标签对应的描述文本需要使用标签标签，通过设置输入的id属性，并在标签中设置=someld，将描述文本与对应的输入相关联。

5.语义化标签应注意的一些问题

使用尽可能少的标签div和span尽可能没有语义；

语义不明显的时候，可以用div，也可以用p，尽量用p，因为p默认有上下间距，有利于和特殊终端兼容；

不要使用纯样式标签，如b、font、u等。并改用css设置。

需要强调的文本可以包含在强标签或em标签中。“强”的默认样式是粗体(不要使用b)，而“中”是斜体(不要使用I)