HTML5+CSS3+JavaScript网站开发实用技术第8章.pptxVIP

使用HTML 5结构元素组织网页1页头部分的设计2小结精品推荐版块的设计侧边导航和焦点图的设计375页脚的设计64快速搜索、滑动Tab和在线咨询版块设计第8章 综合实例8.1 使用HTML 5结构元素组织网页8.1.1 网页结构描述header元素：网站的标题。nav元素:用于页面导航。aside元素：侧边栏。?section元素：网页中要显示的主体内容。footer元素：用来放置网站的版权声明和备案信息等。8.1 使用HTML 5结构元素组织网页 8.1.2 用CSS 3定义网站全局样式为网站设置一个全局样式，例如背景、边界、字体、字号和行高等属性参数，这样，既可以保证不同页面有相对一致的风格，也可以保证网页在不同浏览器中稳定的显示效果。8.2 页头部分的设计header由两个nav组成，第一个nav作为次导航，放置了嵌套两个div元素的链接，外层div设置了宽度，内层的div包含了一个无序列表ul元素，三个列表项提供了顶部的链接。第二个nav作为主导航，用来放置水平导航菜单，放置了两个div，第一个div用来设置顶部图片，第二个div放置了导航栏的链接。8.3 侧边导航和焦点图的设计侧边导航和焦点图版块整体放置在section元素中。section中放置了aside和nav两个元素。在aside元素中放置了左侧导航菜单，而把焦点图放置在nav元素中。8.4 快速搜索、滑动Tab和在线咨询版块设计快速搜索、滑动Tab和在线咨询版块包含了三个div元素，分别对应三个版块。8.5 精品推荐版块的设计精品推荐版块通过section定义，该版块的内容通过无序列表组织，列表项用来放置图片及介绍文字。8.6 页脚的设计页脚部分用footer元素声明，其中包含了4个div元素，在每个div容器中放置了一个无序列表，列表项中内容主要是各类链接。小结本章通过一个综合实例帮助读者运用HTML 5以及CSS 3来理解与掌握网站页面的设计过程，实例先使用HTML 5的结构元素来组织整体网页布局，然后使用CSS 3定义了网站的全局样式，之后设计了组成网站的各个版块的结构和样式，这些版块包括页头、侧边导航、焦点图版块、快速搜索、滑动Tab和在线咨询、精品推荐、页脚等内容。作业1. 简答题（1）简述HTML5新增的结构元素使用的一般方法。（2）举例说明网站中有那些元素适合定义为全局样式。（3）说明CSS应采用什么措施避免样式无法兼容多种浏览器的问题。谢谢