资源名称:CSS + DIV网页样式布局实战从入门到精通
内容简介:
《CSS+DIV网页样式布局实战从入门到精通》通过精选案例引导读者深入学习,系统地介绍了利用CSS和DIV进行网页样式布局的相关知识和操作方法。
全书共21章。第1~5章主要介绍网页样式布局的基础知识,包括基本概念和语法、代码的编写方法、盒子模型及高级特性等;第6~11章主要介绍网页样式布局的常用设置,包括网页字体与对象尺寸、文本与段落、文本样式、文本颜色与效果、背景颜色与图像及图像效果等;第12~16章主要介绍网页样式布局的高级设置,包括网页表格、链接与项目列表、导航菜单、固定宽度布局及变宽度布局等;第17~21章通过实战案例进一步讲解了基础知识的综合应用方法,包括商务、时尚科技、在线购物、娱乐休闲及手机应用等多种类型网页的布局方法。
在《CSS+DIV网页样式布局实战从入门到精通》附赠的DVD多媒体教学光盘中,包含了17小时与图书内容同步的教学录像及所有实例的配套源文件。此外,还赠送了大量相关学习内容的教学录像及扩展学习电子书等。为了满足读者在手机和平板电脑上学习的需要,光盘中还赠送了本书教学录像的手机版视频学习文件。
《CSS+DIV网页样式布局实战从入门到精通》不仅适合网页样式布局的初、中级读者学习使用,也可以作为各类院校相关专业学生和网页制作培训班的教材或辅导用书。
资源目录:
第1章 CSS入门
本章从CSS的基本概念出发,介绍CSS语言的特点,以及如何在网页中引入CSS,并对CSS进行初步的体验。
1.1 CSS的概念
1.1.1 网页中标记的概念
1.1.2 HTML与CSS的互补
1.1.3 浏览器对CSS的支持
1.2 网页设计中的CSS
1.2.1 CSS能做什么
1.2.2 CSS的局限性
1.3 网站CSS赏析
1.3.1 商务网站CSS样式赏析
1.3.2 游戏网站CSS样式赏析
1.4 实例——编写我的第一个CSS样式
1.4.1 从零开始
1.4.2 加入CSS控制
1.4.3 控制图片
1.4.4 CSS的注释
高手私房菜
第2章 CSS 3基本语法
本章重点介绍CSS如何控制页面中的各个标记。先从控制HTML标记的不同方法入手,介绍各种选择器的概念和声明方法,以及CSS的有关属性值。
2.1 构造CSS规则
2.2 实例1——基本CSS选择器
2.2.1 标记选择器
2.2.2 类别选择器
2.2.3 ID选择器
2.3 实例2——在HTML中使用CSS
2.3.1 行内样式
2.3.2 内嵌式
2.3.3 链接式
2.3.4 导入式
2.3.5 各种方式的优先级
2.4 CSS 3的声明
2.4.1 标准声明
2.4.2 合并多重声明
2.5 属性值
2.5.1 整数和实数
2.5.2 长度值
2.5.3 百分比值
2.5.4 URL
2.5.5 颜色值
2.6 CSS的继承
高手私房菜
第3章 手工与借助工具编写网页样式
本章分别通过使用手工与借助工具设置标题、控制图片、设置整体页面等内容,来讲述如何完成一个使用CSS技术的网页。
3.1 实例1——手工编写
3.1.1 从零开始
3.1.2 设置标题
3.1.3 控制图片
3.1.4 设置正文
3.1.5 设置整体页面
3.1.6 对段落进行分别设置
3.1.7 完整代码
3.2 实例2——使用Dreamweaver编写
3.2.1 使用Dreamweaver创建页面
3.2.2 在Dreamweaver中新建CSS规则
3.2.3 在Dreamweaver中编辑CSS规则
3.2.4 为图像创建CSS规则
高手私房菜
第4章 盒子模型
盒子模型是CSS控制页面时一个很重要的概念。只有很好地掌握了盒子模型以及其中的每一个元素的用法,才能真正控制页面中各个元素的位置。
4.1 盒子的内部结构
4.2 实例1——边框
4.2.1 边框类型
4.2.2 属性值的简写形式
4.2.3 边框与背景
4.3 实例2——内边距
4.4 实例3——外边距
4.5 实例4——盒子之间的关系
4.5.1 HTML与DOM
4.5.2 标准文档流
4.5.3 div标记与span标记
4.6 实例5——盒子在标准流中的定位原则
4.6.1 行元素之间的水平margin
4.6.2 块元素之间的竖直margin
4.6.3 嵌套盒子之间的margin
4.6.4 将margin设为负值
4.7 实例6——盒子的浮动
4.7.1 准备代码
4.7.2 设置浮动的div
4.7.3 改变浮动的方向
4.7.4 全部向右浮动
4.7.5 使用clear属性清除浮动的影响
4.8 实例7——盒子的定位
4.8.1 静态定位
4.8.2 相对定位
4.8.3 绝对定位
4.8.4 固定定位
高手私房菜
第5章 CSS 3的高级特性
本章主要介绍CSS的复合选择器、继承性及层叠性等高级特性,学习这些高级特性,在提高页面制作效率上会有很大帮助。
5.1 实例1——复合选择器
5.1.1 交集选择器
5.1.2 并集选择器
5.1.3 后代选择器
5.2 实例2——CSS的继承特性
5.2.1 继承关系
5.2.2 CSS继承的运用
5.3 实例3——CSS的层叠特性
高手私房菜
第6章 网页字体与对象尺寸
文字是网页设计永远不可缺少的元素,文字尺寸的设置关系着网页是否美观。本章从基础文字设置出发,详细讲解CSS设置各种文字效果的方法。
6.1 实例1——指定字体属性
6.1.1 font-weight属性
6.1.2 font-variant属性
6.1.3 font-style属性
6.1.4 font简写属性
6.2 实例2——字体族
6.2.1 泛型字体族
6.2.2 通常安装的字体
6.3 实例3——设置字体
6.3.1 选择字体集
6.3.2 设置字体尺寸
6.3.3 设置文字横向拉伸变形
6.3.4 设置字体尺寸是否统一
6.4 实例4——设置对象尺寸
6.4.1 对象宽度设定
6.4.2 对象高度设定
6.4.3 对象尺寸范围设定
6.4.4 文本行高控制
6.4.5 垂直对齐方式
高手私房菜
第7章 网页文本与段落设计
本章主要介绍文字的有关设置和段落排版,如果说第6章是文字的设置基础,那么本章就是文字的设置应用。
7.1 实例1——添加文本
7.1.1 普通文本
7.1.2 特殊文字符号
7.2 实例2——文本排版
7.2.1 段落标记p与换行标记br
7.2.2 标题标记h1~h6
7.2.3 文本水平居中标记center
7.3 实例3——网页特殊字符
7.4 实例4——文本的应用
高手私房菜
第8章 文本样式
本章通过介绍文本的颜色定义、字体设置效果、段落缩进、字词间距等,来综合讲解排版布局中具体如何设置文本的样式。
8.1 长度单位
8.2 实例1——颜色定义
8.3 实例2——准备页面
8.4 实例3——设置文字的字体
8.5 实例4——设置文字的倾斜效果
8.6 实例5——设置文字的加粗效果
8.7 实例6——英文字母大小写转换
8.8 实例7——控制文字的大小
8.9 实例8——文字的装饰效果
8.10 实例9——设置段落首行缩进
8.11 实例10——设置字词间距
8.12 实例11——设置段落内部的文字行高
8.13 实例12——设置段落之间的距离
8.14 实例13——控制文本的水平位置
8.15 实例14——设置文字与背景的颜色
8.16 实例15——设置段落的垂直对齐方式
高手私房菜
第9章 文本颜色与效果
本章主要是深层次地介绍文本的颜色设置、特殊文本的效果设置以及控制文本间距的操作方法,从而使读者熟练地掌握文本颜色设置和文本效果属性。
9.1 实例1——文本颜色
9.1.1 定义颜色值
9.1.2 有效使用颜色
9.2 实例2——特殊文本效果
9.2.1 text-decoration属性
9.2.2 text-transform属性
9.3 实例3——控制文本间距
9.3.1 letter-spacing属性
9.3.2 word-spacing属性
9.3.3 white-spacing属性
9.3.4 line-height属性
高手私房菜
第10章 背景颜色与图像
任何一个网页,它的背景颜色和图案往往是给用户的第一印象,因此在页面中控制背景和图案是一个网站设计的重要步骤。本章主要讲述CSS控制背景颜色和图像的方法。
10.1 实例1——设置背景颜色
10.2 实例2——设置背景图像
10.3 实例3——设置背景图像平铺
10.4 实例4——设置背景图像位置
10.5 实例5——设置背景图片位置固定
10.6 实例6——设置标题的图像替换
10.7 实例7——使用滑动门技术的标题
高手私房菜
第11章 图像效果
本章通过讲述设置图片边框、图片缩放、图文混排、图片与文字对齐方式等,综合介绍图像的设置方式。
11.1 实例1——设置图片边框
11.1.1 基本属性
11.1.2 为不同的边框分别设置样式
11.2 实例2——图片缩放
11.3 实例3——图文混排
11.3.1 文字环绕
11.3.2 设置图片与文字的间距
11.4 实例4——八大行星科普网页
11.5 实例5——设置图片与文字的对齐方式
11.5.1 横向对齐方式
11.5.2 纵向对齐方式
高手私房菜
第12章 网页表格
网页表格是网页常见的元素,本章主要围绕表格介绍CSS设置其样式的方法。最后通过实例制作计算机报价表来总结本章的知识点。
12.1 实例1——创建表格
12.2 实例2——控制表格
12.2.1 表格中的标记
12.2.2 表格的边框
12.2.3 表格宽度的确定
12.2.4 其他与表格相关的标记
12.3 实例3——表格操作
12.3.1 合并单元格
12.3.2 设置对齐方式
12.3.3 用cellpadding属性和cellspacing属性设定距离
12.4 实例4——鼠标指针经过时整行变色提示的表格
12.4.1 搭建HTML结构
12.4.2 在Firefox和IE9中实现鼠标指针经过时整行变色
12.4.3 在IE6中实现鼠标指针经过时整行变色
12.5 实例5——制作计算机报价表
高手私房菜
第13章 链接与项目列表
网页中除文字、图像、表格等元素外,还有链接和项目列表。网站来源于链接,从本质上来说网站就是链接。
13.1 实例1——丰富的链接特效
13.1.1 动态超链接
13.1.2 按钮式超链接
13.1.3 CSS控制鼠标指针
13.1.4 浮雕背景超链接
13.1.5 让下画线动起来
13.2 实例2——项目列表
13.2.1 列表的符号
13.2.2 图片符号
13.2.3 建立有序列表
13.2.4 建立无序列表
13.2.5 网页列表的应用
高手私房菜
第14章 导航菜单
一个好的网站,导航菜单是不可缺少的元素之一。导航菜单的基调决定着网站的基调。本章主要介绍各种导航菜单的制作方法。
14.1 实例1——简单的导航菜单
14.1.1 竖直导航菜单
14.1.2 横竖自由转换菜单
14.2 实例2——水平导航菜单
14.2.1 自适应的斜角水平菜单
14.2.2 应用滑动门技术的玻璃效果菜单
14.2.3 会跳起的多彩菜单
14.3 实例3——竖直排列的导航菜单
14.3.1 双竖线菜单
14.3.2 双斜角横线菜单
14.3.3 立体菜单
14.3.4 箭头菜单
14.3.5 带说明信息的菜单
14.4 实例4——下拉菜单
高手私房菜
第15章 固定宽度布局
本章主要介绍CSS排版的观念和具体方法,包括CSS排版的整体思路、两种具体的排版结构。最后以制作魔术布局来总结分析CSS的布局方法。
15.1 CSS排版观念
15.1.1 MSN的首页
15.1.2 Hao123的首页
15.1.3 Yahoo的首页
15.2 实例1——单列布局
15.2.1 放置第一个圆角框
15.2.2 设置圆角框的CSS样式
15.2.3 放置其他圆角框
15.3 实例2——“1-2-1”固定宽度布局
15.3.1 准备工作
15.3.2 绝对定位法
15.3.3 浮动法
15.4 实例3——“1-3-1”固定宽度布局
15.5 实例4——魔术布局
15.5.1 魔术布局设计
15.5.2 制作魔术布局
15.5.3 修正缺陷
高手私房菜
第16章 变宽度布局
本章主要讲述常用变宽度布局的制作,变宽度的布局要比固定宽度的布局复杂一些,根本的原因在于宽度不确定,导致很多参数无法确定,必须使用一些技巧来完成。
16.1 实例1——“1-2-1”变宽度网页布局
16.1.1 “1-2-1”等比例变宽布局
16.1.2 “1-2-1”单列变宽布局
16.2 实例2——“1-3-1”变宽度网页布局
16.2.1 “1-3-1”三列宽度等比例布局
16.2.2 “1-3-1”单侧列宽度固定的变宽布局
16.2.3 “1-3-1”中间列宽度固定的变宽布局
16.2.4 “1-3-1”双侧列宽度固定的变宽布局
16.2.5 “1-3-1”中列和侧列宽度固定的变宽布局
16.3 实例3——分列布局背景颜色问题
16.3.1 设置固定宽度布局的列背景色
16.3.2 设置特殊宽度变化布局的列背景色
16.3.3 设置单列宽度变化布局的列背景色
16.3.4 设置多列等比例宽度变化布局的列背景色
高手私房菜
第17章 制作商务类型网页
本章主要以制作红酒企业的网页来讲述商务类型网页的制作方法,使读者能掌握制作商务网页的要点。
17.1 设计整体结构
17.1.1 设计分析
17.1.2 排版架构
17.2 整体设置
17.3 设置页头
17.4 设置中间部分
17.4.1 产品展示
17.4.2 新闻中心
17.4.3 促销产品
17.5 页脚部分
高手私房菜
第18章 制作时尚科技类型网页
本章主要以制作时尚科技类型网页来讲述企业网页的制作方法,使读者能掌握制作企业型网页的要点。
18.1 整体布局
18.1.1 设计分析
18.1.2 排版架构
18.2 设计模块组成
18.2.1 导航区
18.2.2 Banner区
18.2.3 资讯区
18.2.4 页脚
18.3 设置链接
高手私房菜
第19章 制作在线购物类型网页
网上购物是一种便捷的购物方式,也是目前最火的购物方式。本章主要讲述购物网页的整体布局和模块组成。
19.1 整体布局
19.1.1 设计分析
19.1.2 排版架构
19.2 设计模块组成
19.2.1 导航
19.2.2 Banner
19.2.3 产品类别
19.2.4 页脚
19.3 设置链接
高手私房菜
第20章 制作娱乐休闲类型网页
本章主要介绍娱乐休闲网页制作要点及娱乐休闲网页模块组成,使读者初步了解娱乐休闲网页的制作方法。
20.1 设置网页背景
20.2 整体布局
20.2.1 设计分析
20.2.2 排版架构
20.3 设计模块组成
20.3.1 注册
20.3.2 导航
20.3.3 预告
20.3.4 新片
20.3.5 页脚
20.4 设置链接
高手私房菜
第21章 制作适合手机浏览的网页
随着智能手机的普及,制作手机网页也成为了网页制作中的重要部分。本章主要以一个简单的手机网页制作来讲述其制作方法。
21.1 整体布局
21.1.1 设计分析
21.1.2 排版架构
21.2 设计导航菜单
21.3 设置模块内容
高手私房菜
资源截图: