第18章 个人博客网站布局.pptVIP

教学内容：博客，即Blog是继E-mail、BBS、即时通信（IM）之后出现的全新的网络交流方式。使用者可以利用博客自由地表达自己的想法，发布自己的心得。 第18章 个人博客网站布局 教学重点 熟悉博客网站 掌握博客网站主页布局设计的方法 掌握博客网站主页具体制作过程 18.1 博客网站概述 Blog是Web Log的简称，即网志，也叫博客。它是博客的作者与读者以日志形式进行交互的平台。 网页的结构属于三行两列式布局，顶行用于显示网站的Banner，底部行用于显示网站的主要内容。 根据设计要求，将网站从上至下分为3个区域#header、#page和#footer。#page是网站主要内容的容器，在#page中将页面分为左右两部分，分别放置在#content和#sidebar两个Div对象中。 18.2 博客网站主页布局设计 对主页进行详细的布局分析后，接下来就可以进行主页布局的具体制作了。 18.3 博客网站主页布局制作过程 在CSS布局的网页中，一般都把CSS存为单独的文件，这里的CSS文件是default.css，导入default.css的具体操作步骤如下。 18.3.1 导入外部CSS 页面头部部分主要放在#header对象中，下面制作网页头部部分，效果如图18.9所示。 18.3.2 制作网页头部分 18.3.3 制作网页内容部分 页面内容部分主要放在#page对象中，页面内容部分效果如图18.15所示，具体操作步骤如下。 18.3.4 制作页面页脚部分 页面页脚部分主要放在#footer对象中，页面页脚部分效果如图18.42所示，具体操作步骤如下。 18.4练习题 制作一个如图18.46所示的个人网站主页。 *