利用DIV+CSS设计出一个《网站首页

第二章网页设计的思路

关于分享宫崎骏动漫里的经典语录这个网页的实现，首先在index.html页面显示相关信息，然后创立各种信息链接，整个页面布局要求清新，不宜复杂。

1.建立站点；

(1) 打开站点管理→新建→站点→输入名称“宫崎骏动漫里的经典语录” →下一步

(2)单击“下一步”

(3)选好存储位置→单击“下一步” (4)选好服务器文件夹→单击“下一步” (5)单击“下一步” (6)单击“完成”

2.结构分析；

主页整个页面分为三个结构头部，主体，底部。 头部，是所有的导航。

主体是由三个div来分隔的。分为左边为该动漫的作者和发布的时间；中间为这个动漫的经典语录；右边为内容的补充和这些动漫视频的链接。 底部，可以是版权说明。

3.搭建框架；

第 5 页 共 29页

头部 ：包括网页的title和导航栏 经典语录 宫崎骏 留言 经典语录 其他 作者 时间 主要内容：各个动漫的经典语句 其他内容 链接 底部：版权或其他

4.切割效果图；

4.1．头部导航栏

.

第 6 页 共 29 页

4.2．主体

第 7 页 共 29 页

4.3．底部

5.布局页面——头部和导航； (1).视图：

第 8 页 共 29 页