十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
HTML5对比传统HTML有很多的新特性,包括了
创新互联是一家专注于成都网站设计、成都网站制作与策划设计,京山网站建设哪家好?创新互联做网站,专注于网站建设10多年,网设计领域的专业建站公司;建站业务涵盖:京山等地区。京山做网站价格咨询:18980820575
1、语义化标签:对比之前HTML没有体现结构语义化的标签,如:div id="header"/div,HTML5提供语义化标签,如:headerarticlefooternavasidesection等
2、增强型表单:多个新的表单 Input 输入类型,如:color,url,date等这些新特性提供了更好的输入控制和验证。新增表单元素,如:output,用于用于不同类型的输出,比如计算或脚本输出。新增表单属性,如:placehoder 属性,简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示,在用户输入后消失。
3、新增视频 video 和音频 audio 标签
4、Canvas绘图
5、SVG绘图
6、地理定位
7、拖放API
8、Web Worker
9、Web Storage
10、WebSocket
HTML5中新增了
1.header、
2.footer、
3.nav、
4.section、
5.article、
6.aside、
7.figure
多个有语义的结构化标签元素。其中section和article这两个标签和div差不多功能,很容易混淆。
divHTML Spec: “The div element has no special meaning at all.”
这个标签是我们见得最多、用得最多的一个标签。本身没有任何语义,用作布局以及样式化或脚本的钩子(hook)。
section
HTML Spec: “The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.”
与 div 的无语义相对,简单地说 section 就是带有语义的 div 了,但是千万不要觉得真得这么简单。section 表示一段专题性的内容,一般会带有标题。看到这里,我们也许会想到,那么一篇博客文章,或者一条单独的评论岂不是正好可以用 section 吗?接着看:
“Authors are encouraged to use the article element instead of the section element when it would make sense to syndicate the contents of the elemen.”
当元素内容聚合起来更加言之有物时,应该使用 article 来替换 section 。
那么,section 应该什么时候用呢?再接着看:
“Examples of sections would be chapters, the various tabbed pages in a tabbed dialog box, or the numbered sections of a thesis. A Web site’s home page could be split into sections for an introduction, news items, and contact information.”
section 应用的典型场景有文章的章节、标签对话框中的标签页、或者论文中有编号的部分。一个网站的主页可以分成简介、新闻和联系信息等几部分。其实我对这里传达信息很感兴趣,因为感觉 section 和下面要介绍的 artilce 更加适用于模块化应用,这个话题以后会出篇专门的文章来讨论,这里暂时略过。
要注意,W3C 还警告说:
“The section element is not a generic container element. When an element is needed for styling purposes or as a convenience for scripting, authors are encouraged to use the div element instead. A general rule is that the section element is appropriate only if the element’s contents would be listed explicitly in the document’s outline.”
section 不仅仅是一个普通的容器标签。当一个标签只是为了样式化或者方便脚本使用时,应该使用 div 。一般来说,当元素内容明确地出现在文档大纲中时,section 就是适用的。
小时候我们玩积木,一块块积木堆积起来,组成了一个完整的建筑模型,div就是这一块块小积木,用来组成一个完整的网页,浏览器很笨,他只认识人们给他定义好的语法,比如div,当浏览器看到div,就会自己去将div组建成网页。每块小积木还可以取个名字,比如有的叫做房顶,有的叫做底部根基,有的叫做房子主体。
这个div组成的房子里面可以住很多小伙伴,文字、图片、视频动画都是大家庭的一员。
div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白:
style="visibility: none;"
document.getElementById("typediv1").style.visibility="hidden";//隐藏
document.getElementById("typediv1").style.visibility="visible";//显示
p标签里面一般写文字,是段落标签,div是块元素,虽然两个都可以换行,但是各司其职,p可以有首航缩进功能,text-indent,div没有