这篇文章给大家分享的是有关怎么学会HTML5的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
<强>语义标签和页面布局
我们首先讲一个关于一所大学的经典故事。这所大学在建设校园草地时,没有开辟任何步行小道,他们把整个空地种上草,然后等待。
一年以后,人们经常走过的地方,草都被踩光了。于是,这所大学就将这些地方铺设为真正的人行道。
棒极了!这些人行道是人们真正“走”出来的。
HTML5新语义元素的诞生正是基于同样的逻辑。(关于这一点,可以参看W3C设计指南中的“Cowpaths铺平道路”)。
语义元素清晰地向浏览器和开发人员表明了它们的涵义和用途,要理解这一点,可以将它们与& lt;p>标签进行对比。在HTML文件内,& lt;p>标签能定义出一个分区或者一个小节,但是它无法告诉我们分区里的内容,不能传达任何清晰的涵义。
开发人员通常会将ID或者类名与& lt;p>标签配合使用,这会向程序员传达更多的涵义。但遗憾的是,这并不能帮助浏览器领会那种标签的用途。你们;p id=癶eader"祝辞
在HTML5中,有不少新的富含语义的元素,可以向浏览器和开发人员传达元素的用途。你们;header>
W3C挖掘了数亿个Web页的面,找出开发人员一直在使用的ID和类名,一旦开发人员抛出p1, p2这些无意义标签,他们就得到了一个描述非常细致的已经在使用的元素的列表,并让其成为W3C的标准设置。
下面是HTML5的一部分新的语义元素:
?篇文章
?除了
?figcaption
?图
?页脚
?头
?hgroup
?马克
?nav
?部分
?时间
由于这些元素的语义很丰富,相信你可能会猜出其中大部分元素的作用。
为了说得更清楚、下面给出一张图示。
,,,,,& lt; ! DOCTYPE html>
& lt; html>
& lt; head>
,,,& lt; meta charset=皍tf-8",/比;
,,,& lt; title> Title
,,,& lt; link href=https://www.yisu.com/zixun/癱ss/html5reset.css”rel="样式表"/>
<链接的href=" css/风格。css样式表" rel=" "/>
<标题>
在h2 头
在h3
头>
小标题