《通过Dreamweaver.CS3学习HTML+DIV+CSS教学PPT第16章页脚设计.ppt》由会员分享,可在线阅读,更多相关《通过Dreamweaver.CS3学习HTML+DIV+CSS教学PPT第16章页脚设计.ppt(16页珍藏版)》请在三一文库上搜索。
1、第16章 页脚设计,页脚是指在网页底部,起到辅助信息(如版权等)说明的作用。如图所示为网页的页脚。如果没有页脚就好比一篇文章没有结尾一样,使整个网页头重脚轻,从而导致页面风格极不协调。,16.1 页脚风格的确定,显示页脚的风格并不像主体版面跟页面头部的风格一样形式多样。因为其更多的是为了说明辅助信息,所以显示中网页页脚的风格都比较统一。页脚的风格确定一般包括构成要素选择、颜色搭配、字体选择和尺寸等。,16.1.1 页脚的构成要素的添加,页脚的构成要素一般是网页辅助的说明信息,互联网上比较常见的构成要素有以下几种。 1版权声明,16.1.1 页脚的构成要素的添加,2整体导航,16.1.1 页脚的
2、构成要素的添加,3网站备案信息 备案信息是指经过信息产业部允许,通过互联网向上网用户提供信息的服务活动。网站备案的目的是为了防止在网上从事非法的网站经营活动,打击不良互联网信息的传播。如果网站不备案的话,很可能被查处关停。 非经营性网站自主备案是不收任何手续费的,所以建议大家可以自行到备案官方网站去备案。,16.1.1 页脚的构成要素的添加,4友情链接 友情链接指分别在自己的网站上放置对方网站的Logo或网站名称,并设置对方网站的超级链接,使得用户可以从合作网站中发现自己的网站,达到互相推广的目的。友情链接可以为网站带来流量,提高网站的知名度,同时可以提高被搜索引擎搜到的概率。,16.1.1
3、页脚的构成要素的添加,5网站Logo,16.1.1 页脚的构成要素的添加,6网站相关的说明文字 在浏览网站时经常可以看到有的网站有提醒浏览者的相关信息。例如,有些网站在页脚提醒浏览者浏览本网站的最佳分辨率。有些网站则在页脚部分添加网站的口号等。,16.1.2 页脚颜色搭配,页脚颜色的搭配更多地应该服从主体版面,不能使用太鲜艳的颜色。一般页脚的色彩是柔和色调,如灰色和浅色等。如图所示,采用的就是灰色为主色调的页脚。如果想将页脚做得引人一些,但并不想使用柔和的色彩,从而起到强调的作用,那么页脚颜色的使用也应该服从主体版面的颜色色调,并且使用的颜色保持在三种以内。,16.1.3 主体版面字体选择,在
4、网页设计中,页脚宜采用浅色和比主体版面小的字体,这样会使网页的主要内容突出,而且不会破坏页面的整体风格。,16.1.4 页脚的尺寸控制,在前文中,介绍了主体版面的大小选择。一般主体版面的大小有1024768和800600两种,16.2 页脚条的要素添加,上一节介绍了页脚的要素、字体和尺寸。在网页设计中,页脚的制作虽然没有主体版面那么重要,但页脚也是一个网页中必不可少的内容,其设计的好坏也将直接影响到主体页面的美观。下面一起来了解其制作方法。,16.2 页脚条的要素添加,所谓两栏是将主体版面分两列进行显示,两栏式布局的设计思想是将主体版面分别放在左右两个单元格中,然后在单元格中添加主体元素。其具体的制作步骤如下:,16.3 样式调整及修改,与页面头部和主体版面的制作相同,在未进行样式调整的页面美观效果是比较差的,同时会影响页面的整体风格,页脚文件也同样需要样式的调整,从而才能与页面和谐地搭配。,16.3 样式调整及修改,保存CSS文件以及网页。按F12键在浏览器中查看页脚的最终效果,如图所示。,16.4 专家总结,本章主要介绍了页脚文件的组成要素、字体的选择和尺寸的选择等,同时通过实例介绍了页脚文件的具体制作方法,并在第3节中介绍了页脚条样式的调整与修改。通过本章的学习,相信大家对页脚条会有一定的认识。,