频道直达 - 专题 - 新闻 - 技巧 - 组网 - 开发 - 安全 - web编程 - 图像 - 操作系统 - 数据库 - 教育 - 旅游 - 健康 - 时尚 - 驱动 - 软件 - 游戏 - 多媒体 - ERP - 讨论组

我的页面制作方法

来源: 作者:sorrycc 出处:巧巧读书 2008-03-24 进入讨论组
下一页 1 2 

做前端也有几年时间了,不敢说能把他看地多透,但是多多少少还是有些自己的东西。下面以 Tudou.com 的首页为例,总结总结。

就制作而言,我将一张页面分为四层:框架、布局、模块、列表和数据块。

一、框架

页面的框架基本上都是:“头”、“主体”、“尾”。但是对于一些页面如Tudou.com,由于布局的需要,还应在“头”的下面还要加个“菜单”。

我的页面制作方法(图一)

二、布局(以下用#ID表示页面元素)

#Head和#Foot里的就不说了,具体查看演示页面源码。

布局说的是将#Main里的内容分成几大块。我们看Tudou.com,#Main里典型的左右结构,我们用#Layout_1,#Layout_2表示。如图

我的页面制作方法(图二)

三、模块

布局#Layout_1,#Layout_2里的块就是模块了,

按我的理解,模块至少要有一个ID,Class则要视页面设计,给需要重用的加上。

关于模块的ID名称,要取个有意义的名字,当然偷懒的可以用#Col_1,#Col_2,。。。

模块的Class名称用.cols_1,.cols_2,。。。

我的页面制作方法(图三)

模块内部的如下图:

我的页面制作方法(图四)

进入讨论组讨论。
下一页 1 2 
收藏此文】【 】【打印】【关闭
较早的文章:可用性30专题

较新的文章:网页效果图设计之色彩索引
相关图文阅读
频道图文推荐
健 康 咨 询
时 尚 咨 询
巧巧读书宗旨
相关专题
讨论组问题推荐
站内各频道最新更新文档
站内最新制作专题
热门关键字导读
Photoshop教 程照片处理 照片制作 PS快捷键 抠图
计 算 机 故 障XP系统修复
艺 术 与 设 计设计 流媒体 设计欣赏 边框
计 算 机 安 全ARP
站内频道文章精选
巧巧电脑频道编辑信箱  告诉我们您想看的专题或文章