第6章 网页布局1
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
第1篇 网页设计与制作基础 篇
6.4CSS样式表 样式表
5.在Dreamweaver中创建与应用 中创建与应用CSS 中创建与应用
①新建CSS文件 ②新建CSS规则 ③应用CSS
2011-5-2
16
第1篇 网页设计与制作基础 篇
6.4CSS样式表 样式表
6. CSS属性 属性
在“CSS规则定义”对话框的“分类”列表框中,共有类型、背景、区块、 方框、 边框、列表、定位、扩展等八大类。
表格参数设置页 面
2011-5-2
3
第1篇 网页设计与制作基础 篇
6.1使用表格 使用表格
3.插入嵌套表格
嵌套表格就是在已经存在的表格中插入的表格。插入嵌套 表格的方法与插入表格的方法相同。
2011-5-2
4
第1篇 网页设计与制作基础 篇
6.1使用表格 使用表格
4.编辑表格
选择整个表格; 选择整个表格;选择表格中的 行或列;选择单个单元格; 行或列;选择单个单元格;选 择单行或矩形单元格块; 择单行或矩形单元格块;选择 不相邻的单元格 剪切、拷贝和粘贴 剪切、 单元格;排序表格; 单元格;排序表格; 导入表格式数据; 导入表格式数据; 导出表格式数据 • 选择表格 • 表格的编辑操作 • 表格的其他操作 • “扩展表格”模式 切换”扩展表格” 切换”扩展表格” 模式退出” 模式退出”扩展表 格”模式
2011-5-2
17
第1篇 网页设计与制作基础 篇
本章小结
本章的学习,读者应首先了解在Dreamweaver cs4中运 本章的学习,读者应首先了解在Dreamweaver cs4中运 用表格和框架对网页进行整体布局,利用模板和库项目设 计网页,其中的主要内容包括: 表格的基本操作,如创建表格、在表格中插入页面元素、 设置表格属性等。 在网页页面中创建框架和框架集,并对页面布局进行调整, 通过设置框架和框架集的属性来改变框架网页的外观。 模板和库项目的创建与应用。 CCS样式表的基础知识及应用。 CCS样式表的基础知识及应用。 这些都是初学者应该掌握的基本网页布局工具。
2011-5-2 1
第1篇 网页设计与制作基础 篇
6.1使用表格 使用表格
1.表格的概念
表格(Table)在网页制作中是一个非常重要的概念,是由不 同的行、列、单元格组成的一种能够有效描述信息的组织方 式。
2011-5-2
2
第1篇 网页设计与制作基础 篇
6.1使用表格 使用表格
2.插入表格
两种方法: 插入” ”表格” 两种方法:① “插入”→”表格”命令 “表 ②单击“插入”面板的”常用”类别中的 单击“插入”面板的”常用” 按钮上,打开“表格”对话框。 格”按钮上,打开“表格”对话框。
2011-5-2
18
CSS的应用方式有以下两种: 外部CSS样式表 内部CSS样式表
2011-5-2
14
第1篇 网页设计与制作基础 篇
6.4CSS样式表 样式表
4.使用 使用CSS面板 面板
创建和管理CSS规则: ◆所有模式与当前模式; ◆ 切换、移动CSS规则; ◆ 删除CSS规则; ◆ 重命名
2011-5-2
15
框架是将浏览器窗口划分为多个区域,每个区域可以分别显示不同的网 页,并且各个框架之间不存在干扰,在网页模板出现之前,框架技术是 最常用的布局网页工具之一。
1.框架的概念
• 框架网页的功能 • 框架的结构 • 框架结构的优缺点
2011-5-2
6
第1篇 网页设计与制作基础 篇
6.2
Dreamweaver中使用框架 中使用框架
创建框架网页过程:选择“文件”→“新建”命令,打开“新建文档” 对话框,设置选中框架样式后,单击“创建”按钮即可
2.布局网页文档
在HTML网页文档中应用框架(参见教材P92)
2011-5-2 7
第1篇 网页设计与制作基础 篇
6.2
Dreamweaver中使用框架 中使用框架
3.保存框架
三种保存框架和框架集的具体方法: (1)保存框架集文件 (2)保存框架中显示的文档 (3)保存与一组框架关联的所有文件:
2011-5-2 5
调整表格合适大小;更改列 调整表格合适大小; 宽和行高;添加和删除行、 宽和行高;添加和删除行、 拆分和合并单元格; 列;拆分和合并单元格;设 置表格属性;设置单元格、 置表格属性;设置单元格、 行和列的属性
第1篇 网页设计与制作基础 篇
6.2
Dreamweaver中使用框架 中使用框架
1. CSS概述 概述
CSS是“Cascading Styles Sheets”的缩写,中文名称是层叠样 式表。用于控制网页样式并允许将样式与网页内容分离的一种 标记性语言。CSS可将网页的内容与表现形式分开,使网页的 外观设计从网页内容中独立出来单独管理。要改变网页的外观 时,只需更改CSS样式。
9
第1篇 网页设计与制作基础 篇
6.3使用模板和库
1.模板的使用
模板是一种特殊类型的文档,扩展名为.dwt,用于设计“固定的”页面布局。
相关操作: 相关操作: • 创建模板 • 设计模板文档的页面属性 • 定义模板区域 • 应用模板 • 管理模板
2011-5-2
10
第1篇 网页设计与制作基础 篇
6.3使用模板和库
2.库的使用
库项目是避免重复输入具有相同格式和内容的文档元素组合。
相关操作: 相关操作: • 库项目是避免重复输入具有相同格式和内容的文档元素组合。 • 创建库项目 • 编辑库项目 • 应用库项目 • 脱离库项目
2011-5-2
11
第1篇 网页设计与制作基础 篇
6.4Байду номын сангаасSS样式表 样式表
第1篇 网页设计与制作基础 篇
第6章 网页布局 章 学习目标: 学习目标
了解表格的基本概念。 掌握创建和编辑表格的方法。 掌握设置表格属性的方法。 掌握创建和保存框架的方法。 掌握设置框架和框架集属性的方法。 掌握模板的创建和应用。 掌握库项目的创建和应用。 掌握CSS样式表的使用。 掌握CSS样式表的使用。
2011-5-2
8
第1篇 网页设计与制作基础 篇
6.2
Dreamweaver中使用框架 中使用框架
• 创建嵌套框架 • 选择框架和框架集 • 调整框架网页大小
4.编辑框架
(具体过程参见教材P93)
5.设置框架和框架集属性
• 设置框架属性 • 设置框架集属性
2011-5-2
(具体过程参见教材 P94)
2011-5-2
12
第1篇 网页设计与制作基础 篇
6.4CSS样式表 样式表
2. CSS的基本语法 的基本语法
CSS的样式规则由两部分组成:选择器和声明。
新建CSS规则页面 规则页面 新建
2011-5-2
13
第1篇 网页设计与制作基础 篇
6.4CSS样式表 样式表
3. CSS的应用方式 的应用方式