DIVCSS页面布局实例

DIVCSS页面布局实例

ID:40841971

大小:750.51 KB

页数:9页

时间:2019-08-08

DIVCSS页面布局实例_第1页
DIVCSS页面布局实例_第2页
DIVCSS页面布局实例_第3页
DIVCSS页面布局实例_第4页
DIVCSS页面布局实例_第5页
资源描述:

《DIVCSS页面布局实例》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、固定宽度布局综合实例:制作个人网站首页本实例讲解如何制作个人网站的首页。内容包括:分析个人网站首页的架构分块制作个人网站首页个人网站首页构架分析当网页设计师制作好个人网站的首页效果图,交给页面制作人员进行网页制作。页面制作人员只需要制作出与效果图一致并且兼容主流浏览器的标准页面即可。分块制作个人网站首页在对效果图进行分析得到页面结构图后,就可以进行分块制作网页。制作网页的主要遵循从总体到部分,从上部到下部的顺序。制作个人网站首页的总体布局制作个人网站首页首先从制作其总体布局开始,然后再细分到每个块区。本实例的页面分为左中右三部分,使用左中右浮动的布局方式。1.建立网站文件夹2.构建整体网页的

2、结构3.构建整体网页的布局实现左中右浮动布局1.实现左中右浮动布局2.制作leftCol容器的背景3.设置midCol容器的背景图4.设置rigthCol容器的背景图制作个人网站首页的左边栏目(leftCol)在leftCol中只包含相册一个栏目,命名为gallery。在相册中包含相册栏目的栏目标题,使用h4标签嵌套。相册中的相片使用一个无序列表嵌套。制作个人网站首页的中间栏目(midCol)在midCol中包含三个垂直排列的文章列表。这三个文章列表分别为“最新日志”、“最新留言”和“旅游日志”。1.设置文章列表的位置2.添加文章列表3.设置文章列表的样式制作个人网站首页的右边栏目(righ

3、tCol)rightCol用于放置网页的导航,使用一个无序列表嵌入导航内容。

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。