DIV+CSS布局与样式之网站设计基础及精粹合集(套装共2册)

DIV+CSS布局与样式之网站设计基础及精粹合集(套装共2册)

DIV+CSS布局与样式之网站设计精粹

1 网站制作前需知

1.1 网站开发流程
1.2 分析网页效果图
1.3 与产品经理、设计师、后端工程师进行有效沟通
1.4 XHTML CSS基础知识

2 企业网站

2.1 页面效果图分析
2.2 布局规划及切图
2.3 XHTML编写
2.4 CSS编写
2.5 制作中需要注意的问题

3 个人网站

3.1 页面效果图分析
3.2 布局规划及切图
3.3 XHTML编写
3.4 CSS编写
3.5 制作中需要注意的问题

4 产品展示网站

4.1 页面效果图分析
4.2 布局规划及切图
4.3 XHTML编写
4.4 CSS编写
4.5 制作中需要注意的问题

5 教育科研机构网站

5.1 页面效果图分析
5.2 布局规划及切图
5.3 XHTML编写
5.4 CSS编写
5.5 制作中需要注意的问题

6 电子商务网站

6.1 页面效果图分析
6.2 布局规划及切图
6.3 XHTML编写
6.4 CSS编写
6.5 制作中需要注意的问题

7 电子政务网站

7.1 页面效果图分析
7.2 布局规划及切图
7.3 XHTML编写
7.4 CSS编写
7.5 制作中需要注意的问题

8 搜索资讯网站

8.1 页面效果图分析
8.2 布局规划及切图
8.3 XHTML编写
8.4 CSS编写
8.5 制作中需要注意的问题

9 电影网站

9.1 页面效果图分析
9.2 布局规划及切图
9.3 XHTML编写
9.4 CSS编写
9.5 制作中需要注意的问题

10 游戏网站

10.1 页面效果图分析
10.2 布局规划及切图
10.3 XHTML编写
10.4 CSS编写
10.5 制作中需要注意的问题

11 婚庆网站

11.1 页面效果图分析
11.2 布局规划及切图
11.3 XHTML编写
11.4 CSS编写
11.5 制作中需要注意的问题——z-index属性

12 论坛类网站

12.1 页面效果图分析
12.2 布局规划及切图
12.3 XHTML编写
12.4 CSS编写
12.5 制作中需要注意的问题

13 餐饮网站

13.1 页面效果图分析
13.2 布局规划及切图
13.3 XHTML编写
13.4 CSS编写
13.5 制作中需要注意的问题

14 汽车网站

14.1 页面效果图分析
14.2 布局规划及切图
14.3 XHTML编写
14.4 CSS编写
14.5 制作中需要注意的问题——IE 6下1px间距的问题

15 在线阅读网站

15.1 页面效果图分析
15.2 布局规划及切图
15.3 XHTML编写
15.4 CSS编写
15.5 制作中需要注意的问题

16 常用浏览器及兼容处理

16.1 常用浏览器
16.2 兼容处理

17 网页制作的调试工具及使用

17.1 Firefox浏览器下的页面调试工具及使用
17.2 IE浏览器下的页面调试工具及使用
17.3 Chrome浏览器下的页面调试工具及使用

18 代码发布前的优化

18.1 检查代码
18.2 压缩代码
18.3 版本控制
18.4 上传

DIV+CSS布局与样式之网站设计基础

1 网页与网站的常识

1.1 互联网常识
1.1.1 组成网站的要素
1.1.2 网站域名
1.1.3 域名解析
1.1.4 网站空间
1.1.5 虚拟主机
1.2 网页常识
1.2.1 网页的结构描述语言HTML
1.2.2 XHTML和HTML的区别
1.2.3 网页的分类
1.2.4 网页的源代码
1.3 网站常识
1.3.1 网站开发语言
1.3.2 动态网站和静态网站
1.3.3 网站建设流程
1.4 初学者常见问题
1.4.1 XHTML语言的特点
1.4.2 浏览器的作用
1.4.3 静态网页和动态网页的区别

2 网站制作基础

2.1 如何使用Dreamweaver建站
2.1.1 定义站点
2.1.2 制作静态网页
2.1.3 制作动态网页
2.1.4 浏览网页
2.2 策划网站
2.2.1 确定网站主题
2.2.2 网站需求分析
2.2.3 网站框架图设计/交互设计
2.3 视觉设计
2.4 页面开发
2.4.1 如何切图并保存切片
2.4.2 CSS选择器
2.4.3 CSS盒模型
2.4.4 CSS定位
2.4.5 认识div层
2.4.6 div和span的区别
2.4.7 网站文件规划
2.4.8 CSS样式规划
2.5 页面开发标准和规范
2.6 综合练习1——图文排版效果
2.7 综合练习2——淘宝导购菜单
2.8 初学者常见问题
2.8.1 DIV+CSS网站标准设计的优势
2.8.2 如何考虑网站推广问题
2.8.3 什么是Web标准
2.8.4 如何理解margin的加倍问题
2.8.5 margin:0 auto表示什么含义

3 左右两栏固定宽度的布局

3.1 页面布局的分析
3.2 页面布局的实现
3.2.1 两栏浮动
3.2.2 两栏绝对定位
3.2.3 一栏浮动,另一栏绝对定位
3.3 网页实例
3.3.1 效果图分析
3.3.2 切图
3.3.3 绘制框架图
3.3.4 编写XHTML代码
3.3.5 编写CSS代码
3.4 小结

4 左右两栏宽度自适应的布局

4.1 页面布局的分析
4.1.1 示意图
4.1.2 布局分析
4.2 页面布局的实现
4.2.1 两栏浮动
4.2.2 两栏绝对定位
4.2.3 一栏浮动,另一栏绝对定位
4.3 网页实例
4.3.1 效果图分析
4.3.2 切图
4.3.3 绘制框架图
4.3.4 编写XHTML代码
4.3.5 编写CSS代码
4.4 小结

5 一栏宽度固定,另一栏宽度自适应的布局

5.1 页面布局的分析
5.1.1 示意图
5.1.2 布局分析
5.2 页面布局的实现
5.2.1 一栏浮动,另一栏默认文档流并设置向左外边距
5.2.2 一栏绝对定位,另一栏默认文档流并设置向左外边距
5.3 网页实例
5.3.1 效果图分析
5.3.2 切图
5.3.3 绘制框架图
5.3.4 编写XHTML代码
5.3.5 编写CSS代码
5.4 小结

6 三栏宽度固定的布局

6.1 页面布局的分析
6.1.1 示意图
6.1.2 布局分析
6.2 页面布局的实现
6.2.1 左中右三栏浮动
6.2.2 左中右三栏绝对定位
6.2.3 左右两栏浮动,中间栏绝对定位
6.3 网页实例
6.3.1 效果图分析
6.3.2 切图
6.3.3 绘制框架图
6.3.4 编写XHTML代码
6.3.5 编写CSS代码
6.4 小结

7 左右两栏宽度固定,中间栏宽度自适应的布局

7.1 页面布局的分析
7.1.1 示意图
7.1.2 布局分析
7.2 页面布局的实现
7.2.1 左右两栏浮动,中间栏默认文档流并设置左右外边距
7.2.2 左右两栏绝对定位,中间栏默认文档流并设置左右外边距
7.3 网页实例
7.3.1 效果图分析
7.3.2 切图
7.3.3 绘制框架图
7.3.4 编写XHTML代码
7.3.5 编写CSS代码
7.4 小结

8 高度自适应的布局

8.1 页面布局的分析
8.1.1 示意图
8.1.2 布局分析
8.2 页面布局的实现
8.2.1 正负内外边距
8.2.2 为父容器添加背景图
8.3 网页实例
8.3.1 效果图分析
8.3.2 切图
8.3.3 绘制框架图
8.3.4 编写XHTML代码
8.3.5 编写CSS代码
8.4 小结

9 项目1——论坛

9.1 页面效果图分析
9.1.1 页面头部和页脚分析
9.1.2 首页主体内容分析
9.1.3 内页主体内容分析
9.2 布局规划及切图
9.2.1 页面布局规划
9.2.2 切割首页及导出图片
9.2.3 切割内页及导出图片
9.3 XHTML编写
9.3.1 搭建页面XHTML框架
9.3.2 编写页面头部和页脚的XHTML
9.3.3 编写页面公共部分的XHTML
9.3.4 编写首页主体内容的XHTML
9.3.5 编写内页主体内容的XHTML
9.3.6 总览首页XHTML代码
9.3.7 总览内页XHTML代码
9.4 CSS编写
9.4.1 页面公共部分的CSS编写
9.4.2 页面框架的CSS编写
9.4.3 页面头部和页脚的CSS编写
9.4.4 首页主体内容的CSS编写
9.4.5 内页主体内容的CSS编写
9.4.6 网站CSS代码总览
9.5 制作中需要注意的问题
9.5.1 网站文件规划
9.5.2 CSS样式规划

10 项目2——电子政务网站

10.1 页面效果图分析
10.1.1 头部和页脚分析
10.1.2 首页主体内容分析
10.1.3 内页主体内容分析
10.2 布局规划及切图
10.2.1 页面布局规划
10.2.2 切割首页及导出图片
10.2.3 切割内页及导出图片
10.3 XHTML编写
10.3.1 页面的XHTML框架搭建
10.3.2 页面头部和页脚的XHTML编写
10.3.3 页面公共部分的XHTML编写
10.3.4 首页主体内容的XHTML编写
10.3.5 内页主体内容的XHTML编写
10.3.6 首页XHTML代码总览
10.3.7 内页XHTML代码总览
10.4 CSS编写
10.4.1 页面公共部分的CSS编写
10.4.2 页面框架的CSS编写
10.4.3 页面头部和页脚的CSS编写
10.4.4 首页主体内容的CSS编写
10.4.5 内页主体内容的CSS编写
10.4.6 网站CSS代码总览
10.5 制作中需要注意的问题
10.5.1 marquee
10.5.2 word-spacing

11 项目3——电子商务网站

11.1 页面效果图分析
11.1.1 头部和页脚分析
11.1.2 首页主体内容分析
11.1.3 内页主体内容分析
11.2 布局规划及切图
11.2.1 页面布局规划
11.2.2 切割首页及导出图片
11.2.3 切割内页及导出图片
11.3 XHTML编写
11.3.1 页面的XHTML框架搭建
11.3.2 页面头部和页脚的XHTML编写
11.3.3 页面公共部分的XHTML编写
11.3.4 首页主体内容的XHTML编写
11.3.5 内页主体内容的XHTML编写
11.3.6 首页XHTML代码总览
11.3.7 内页XHTML代码总览
11.4 CSS编写
11.4.1 页面公共部分的CSS编写
11.4.2 页面框架的CSS编写
11.4.3 页面头部和页脚的CSS编写
11.4.4 首页主体内容的CSS编写
11.4.5 内页主体内容的CSS编写
11.4.6 网站CSS代码总览
11.5 制作中需要注意的问题
11.5.1 CSS Sprites技术的利与弊
11.5.2 准确提炼网站中的公共模块

12 项目4——新品展示网站

12.1 页面效果图分析
12.1.1 头部和页脚分析
12.1.2 首页主体内容分析
12.1.3 内页主体内容分析
12.2 布局规划及切图
12.2.1 页面布局规划
12.2.2 切割首页及导出图片
12.2.3 切割内页及导出图片
12.3 XHTML编写
12.3.1 页面的XHTML框架搭建
12.3.2 页面头部和页脚的XHTML编写
12.3.3 页面公共部分的XHTML编写
12.3.4 首页主体内容的XHTML编写
12.3.5 内页主体内容的XHTML编写
12.3.6 首页XHTML代码总览
12.3.7 内页XHTML代码总览
12.4 CSS编写
12.4.1 页面公共部分的CSS编写
12.4.2 页面框架的CSS编写
12.4.3 页面头部和页脚的CSS编写
12.4.4 首页主体内容的CSS编写
12.4.5 内页主体内容的CSS编写
12.4.6 网站CSS代码总览
12.5 制作中需要注意的问题
12.5.1 网页的编码格式
12.5.2 CSS加入网页的方法

13 网站的发布

13.1 整理源代码
13.1.1 XHTML代码的检查
13.1.2 CSS代码的检查
13.1.3 网页调试
13.1.4 压缩代码
13.2 购买空间和域名
13.3 上传网站
13.4 维护与运营
13.5 读者常见问题
13.5.1 如何让别人通过互联网访问我的网站
13.5.2 如何能让百度、谷歌等收录我的网站
13.5.3 网站是否要备案

附录A HTML中支持的颜色名称

附录B CSS常用的属性

附录C

思维导图

DIV+CSS布局与样式之网站设计基础及精粹合集(套装共2册)

防止博客图床图片失效,防止图片源站外链:

http://www.processon.com/chart_image/5e5b39dae4b0c037b6081d20.png)

思维导图在线编辑链接:

https://www.processon.com/view/5e5b39dae4b0c037b6081d1d

原文地址:https://www.cnblogs.com/jingle1267/p/12972014.html