任务3-运用HTML5的新标签.pptxVIP

;;;; 依据草图实现基本的HTML只是实现前端页面的一小步，HTML5 中所有的标签都是有结构性的。 本任务就是使用HTML5新标签来优化门户网站主页的页面文档。;;;/;/;举例演示;举例：;;3 article标签;;4 nav标签;5 aside标签;6 header标签;7 footer标签;;;1 figure 标签和figcaption标签;举例演示;2 hgroup标签;举例演示;3 dialog标签;;;;1 details标签和summary标签;举例演示;;;;;举例演示;;例如： meter value=148 min=0 max=160 low=20 high=110 title=148票 optimum=120 /meter;举例演示;;;;;;举例演示;;;;meter 标签不应用于指示进度，如果标记进度条，请使用 progress 标签。;;个人博客页面结构设计;HTML5结构设计示意图;;【演示】本任务就是使用HTML5新标签来优化门户网站主页的页面文档。;;div标签和span标签;div、section和article的区别和使用;;【实训目的】 1.通过网页页面分析，掌握HTML5结构性标签的语义。 2.能通过网页页面与“查看源代码”功能，模仿编写HTML页面 【实训内容】 实训任务1：通过浏览清华大学主页，分析其HTML5