网页设计与制作第三章
合集下载
网页设计与制作第三章
上一页 返回
3.3 用Dreamweaver 8制作网页
3.3.1创建站点及网页
1.规划站点结构 网站是多个网页的集合，其包括一个首页和若十个分页，
这种集合不是简单的集合。为了达到最佳效果，在创建任何 Web站点页面之前，要对站点的结构进行设计和规划。卞要 包括决定要创建多少页，每页上显示什么内容，页面布局的 外观以及各页是如何互相连接起来的，等等。
返回
3.2 Dreamweaver 8基本工作环境
3.2.1界面介绍
新建或打开一个文档，进入Dreamweaver 8的标准 工作界面。Dreamweaver 8的标准工作界面包括：标题 显示、菜单栏、插入面板组、文档工具栏、标准工具栏、文 档窗口、状态栏、属性面板和浮动面板组，如图3-2所示。
下一页 返回
下一页 返回
3.3 用Dreamweaver 8制作网页
2.创建站点
在Dreamweave 8中可以有效地建立并管理多个站点。 创建站点有两种方法：一是利用向导完成；一是利用高级设 定来完成。
在创建站点前，用户可以先在自己的电脑硬盘上新建一 个以英文或数字命名的空文件夹作为本地站点使用。
上一页 下一页 返回
上一页 下一页 返回
3.2 Dreamweaver 8基本工作环境
3.浮动面板
其他面板可以统称为浮动面板，这些面板都浮动于编辑 窗口之外。在初次使用Dreamweave 8的时候，这些面板 根据功能被分成了若十组。在窗口菜单中，选择不同的命令 可以打开基本面板组、设计面板组、代码面板组、应用程序 面板组、资源面板组和其他面板组。
上一页 下一页 返回
3.2 Dreamweaver 8基本工作环境
4.状态栏
“文档”窗口底部的状态栏提供与用户正创建的文档有 关的其他信息。标签选择器显示环绕当前选定内容的标签层 次结构。单击该层次结构中的任何标签以选择该标签及其全 部内容。单击<body>标签可以选择文档的整个正文。
3.3 用Dreamweaver 8制作网页
3.3.1创建站点及网页
1.规划站点结构 网站是多个网页的集合，其包括一个首页和若十个分页，
这种集合不是简单的集合。为了达到最佳效果，在创建任何 Web站点页面之前，要对站点的结构进行设计和规划。卞要 包括决定要创建多少页，每页上显示什么内容，页面布局的 外观以及各页是如何互相连接起来的，等等。
返回
3.2 Dreamweaver 8基本工作环境
3.2.1界面介绍
新建或打开一个文档，进入Dreamweaver 8的标准 工作界面。Dreamweaver 8的标准工作界面包括：标题 显示、菜单栏、插入面板组、文档工具栏、标准工具栏、文 档窗口、状态栏、属性面板和浮动面板组，如图3-2所示。
下一页 返回
下一页 返回
3.3 用Dreamweaver 8制作网页
2.创建站点
在Dreamweave 8中可以有效地建立并管理多个站点。 创建站点有两种方法：一是利用向导完成；一是利用高级设 定来完成。
在创建站点前，用户可以先在自己的电脑硬盘上新建一 个以英文或数字命名的空文件夹作为本地站点使用。
上一页 下一页 返回
上一页 下一页 返回
3.2 Dreamweaver 8基本工作环境
3.浮动面板
其他面板可以统称为浮动面板，这些面板都浮动于编辑 窗口之外。在初次使用Dreamweave 8的时候，这些面板 根据功能被分成了若十组。在窗口菜单中，选择不同的命令 可以打开基本面板组、设计面板组、代码面板组、应用程序 面板组、资源面板组和其他面板组。
上一页 下一页 返回
3.2 Dreamweaver 8基本工作环境
4.状态栏
“文档”窗口底部的状态栏提供与用户正创建的文档有 关的其他信息。标签选择器显示环绕当前选定内容的标签层 次结构。单击该层次结构中的任何标签以选择该标签及其全 部内容。单击<body>标签可以选择文档的整个正文。
网页设计与制作讲义课件第3章
图案填充采用Fireworks 8预设的图案或用户自己选择 的图案进行填充。
渐变填充采用若干种颜色之间平滑地过渡来进行填 充。
单击颜色拾取框上的【填充选项】按钮可以选择填充 的类型并作进一步的设置。
(2) 【笔尖大小】：用于设置刷子、铅笔、橡皮擦等绘图 工具的笔头的粗细。
(3) 【边缘】：用于设置用绘图工具绘出的图像边缘的柔 和程度。
网页设计与制作课件第 3章
精品
本章重点：
位图绘图和编辑操作 位图的选区操作 矢量图绘图和编辑操作 路径的操作 文字的使用方法 路径、文字、选区互相转换
3.1位图绘制
位图是由像素组成的。Fireworks 8提供了许多 修饰位图图像的方法，包括修饰、裁剪、羽化和克隆 图像等操作。利用图层和蒙版技术还可以进行图像的 后期创作，可以取得一些特殊的效果。
3. 设置不规则选区
用于设置不规则选区的是【套索工具】。具体操作如 下：
选择【自动擦除】选项时，当【铅笔工具】在描边颜色上拖 动时会自动转为使用填充颜色绘图，相当于擦除了描边。
3.刷子工具
【刷子工具】汇集了生活中各种绘图工具的功能，可 以模拟各种作图手法画出异彩纷呈的图像。单击工具 箱中的【刷子工具】按钮，并在属性面板里设置所需 的属性，然后在画布中拖曳鼠标即可画出相应图形。
3.1.1位图的绘图操作
1. 绘图工具的常用属性
Fireworks 8 工具箱里有很多绘图工具，在属性面 板里可以设置绘图工具的各种属性，使之具有各种不 同的功能和状态，以满足各种各样的绘图需求。属性 面板里各项属性的功能如下。
(1) 【颜色】：用户可以通过单击【颜色选择按钮】 打开颜色拾取框来选择所需的颜色，颜色拾取框上列 出了网络安全色；单击【系统颜色选取器】按钮可以 打开调色板，选用其它丰富多彩的颜色。单击【透明】 按钮可以选择无色。
渐变填充采用若干种颜色之间平滑地过渡来进行填 充。
单击颜色拾取框上的【填充选项】按钮可以选择填充 的类型并作进一步的设置。
(2) 【笔尖大小】：用于设置刷子、铅笔、橡皮擦等绘图 工具的笔头的粗细。
(3) 【边缘】：用于设置用绘图工具绘出的图像边缘的柔 和程度。
网页设计与制作课件第 3章
精品
本章重点：
位图绘图和编辑操作 位图的选区操作 矢量图绘图和编辑操作 路径的操作 文字的使用方法 路径、文字、选区互相转换
3.1位图绘制
位图是由像素组成的。Fireworks 8提供了许多 修饰位图图像的方法，包括修饰、裁剪、羽化和克隆 图像等操作。利用图层和蒙版技术还可以进行图像的 后期创作，可以取得一些特殊的效果。
3. 设置不规则选区
用于设置不规则选区的是【套索工具】。具体操作如 下：
选择【自动擦除】选项时，当【铅笔工具】在描边颜色上拖 动时会自动转为使用填充颜色绘图，相当于擦除了描边。
3.刷子工具
【刷子工具】汇集了生活中各种绘图工具的功能，可 以模拟各种作图手法画出异彩纷呈的图像。单击工具 箱中的【刷子工具】按钮，并在属性面板里设置所需 的属性，然后在画布中拖曳鼠标即可画出相应图形。
3.1.1位图的绘图操作
1. 绘图工具的常用属性
Fireworks 8 工具箱里有很多绘图工具，在属性面 板里可以设置绘图工具的各种属性，使之具有各种不 同的功能和状态，以满足各种各样的绘图需求。属性 面板里各项属性的功能如下。
(1) 【颜色】：用户可以通过单击【颜色选择按钮】 打开颜色拾取框来选择所需的颜色，颜色拾取框上列 出了网络安全色；单击【系统颜色选取器】按钮可以 打开调色板，选用其它丰富多彩的颜色。单击【透明】 按钮可以选择无色。
网页设计与制作 第3章 CSS技术基础
332在style标记符中定义样式信息333引用外部样式表中的样式信息在style标记符中定义样式对于单独网页的格式设置和维护很有效但如果在一个大网站中为每个页面都定义类似的样式显然又是效率不高的这时最好的办法就是将重复在多个网页中使用的样式放在外部样式表文件中然后通过链接的方式引用其中的样式
第3章 CSS技术基础
用户可以在CSS中插入注释来说明用户代码的意思，
3.3 在网页中使用CSS
3.3.1 在标记符中直接嵌套样式信息
在标记符中直接嵌套样式信息又称为“局部引 用”，即将样式直接嵌套在 HTML 标记里使用的。 用这种方法，可以很简单的对某个元素单独定义 样式。 使用style属性可以在HTML标记符中直接嵌入 样式定义，如下所示： <标记符style："property l：value l；property 2： value 2；……">
3.4.2 文本属性
1．文字间隔属性(word-spacing)
文字间隔属性定义一个附加在文字（单词）之 间的间隔数量。该值必须符合长度格式，允许使
用负值。
需要特别说明的是，该属性是针对英文单词的
间隔，而不是中文的文字间隔，中文的文字间隔
应该用下面讲到的letter-spacing。同时在中文版的 IE浏览器中也不支持该属性。
CSS 的主要功能是通过对 HTML 选择器进行设定，
来实现对网页中的字体、字号、颜色、背景、图像记
其他元素的控制，使网页能够完全按照设计者的要求
来显示。
3.2 CSS样式
3.2.1 CSS样式表组成
CSS 的定义由三部分构成：选择符 selector、属性 property和属性值value。其基本格式如下： selector{property l ： value l ； property 2 ： value 2；……} property表示由CSS标准定义的样式属性，value表示 样式属性的值。
第3章 CSS技术基础
用户可以在CSS中插入注释来说明用户代码的意思，
3.3 在网页中使用CSS
3.3.1 在标记符中直接嵌套样式信息
在标记符中直接嵌套样式信息又称为“局部引 用”，即将样式直接嵌套在 HTML 标记里使用的。 用这种方法，可以很简单的对某个元素单独定义 样式。 使用style属性可以在HTML标记符中直接嵌入 样式定义，如下所示： <标记符style："property l：value l；property 2： value 2；……">
3.4.2 文本属性
1．文字间隔属性(word-spacing)
文字间隔属性定义一个附加在文字（单词）之 间的间隔数量。该值必须符合长度格式，允许使
用负值。
需要特别说明的是，该属性是针对英文单词的
间隔，而不是中文的文字间隔，中文的文字间隔
应该用下面讲到的letter-spacing。同时在中文版的 IE浏览器中也不支持该属性。
CSS 的主要功能是通过对 HTML 选择器进行设定，
来实现对网页中的字体、字号、颜色、背景、图像记
其他元素的控制，使网页能够完全按照设计者的要求
来显示。
3.2 CSS样式
3.2.1 CSS样式表组成
CSS 的定义由三部分构成：选择符 selector、属性 property和属性值value。其基本格式如下： selector{property l ： value l ； property 2 ： value 2；……} property表示由CSS标准定义的样式属性，value表示 样式属性的值。
网页设计与制作 第3版 第3章 建立本地站点
第3章 建立本地站点
3.3 综合实训案例：创建“我的第一个站点”
⑤在“文件”面板中选择“本地视 图”，在站点的根目录“站点 - 我 的第一个站点”上右击，在弹出的 快捷菜单中选择“新建文件”命令， 文件名称为index.html，结果如图所 示。
第3章 建立本地站点
3.3 综合实训案例：创建“我的第一个站点”
第3章 建立本地站点
3.2 管理本地站点
3.2.2 站点的其他操作 ● 导出 。 单击 按钮，弹出“导出站点”对话框，如图所示。
第3章 建立本地站点
3.2 管理本地站点
3.2.2 站点的其他操作
● 导入站点
。单击
按钮，弹出“导入站点”对话框。
3.2 管理本地站点
3.2.2 站点的其他操作
第3章 建立本地站点
第3章 建立本地站点
3.3 综合实训案例：创建“我的第一个站点”
④在“文件”面板中选择“本地视图”， 在站点的根目录“站点 - 我的第一个站点” 上右击，在弹出的快捷菜单中选择“新 建文件夹”命令，文件夹名称为images， 然后用同样的方式再创建两个文件夹， 其名称分别是videos和styles。最终创建的 文件夹如图所示。
3.2 管理本地站点
3.2.2 站点的其他操作
第3章 建立本地站点
（4）重命名文件或文件夹 要在站点中重命名文件或文件夹， 可在“文件”面板上选择并右击 要操作的文件或文件夹，在弹出 的快捷菜单中选择“编 辑”→“重命名”。等选中文件 的名称变为可编辑状态后，输入 新的文件名称，按Enter键，完 成重命名操作。
3.2 管理本地站点
3.2.2 站点的其他操作
第3章 建立本地站点
1．“管理站点”对话框 如要对站点进行管理， 在菜单栏中选择“站 点”→“管理站点”命 令，弹出“管理站点” 对话框。
网页设计与制作教程第3章
第3章矢量绘图与文字3.1绘制矢量图形3.1.1绘制直线、矩形和椭圆图3-1 【线条工具】默认属性面板图3-2 【线条工具】扩展属性面板图3-3 【矩形工具】的属性面板3.1.2 绘制多边形和星形图3-5 【多边形工具】的属性面板之一·30·图3-6 【多边形工具】的属性面板之二图3-7 【星形工具】的属性面板3.1.3绘制圆角矩形图3-8 【圆角矩形工具】的属性面板3.1.4绘制路径3.2编辑路径3.2.1路径的自由变形3.2.2切割路径图3-11 用【刀子工具】单击路径切割·31·图3-12 用【刀子工具】切割闭合路径3.2.3重绘路径图3-13 重绘路径3.2.4组合路径图3-14 应用【联合】命令前后的效果对比图3-15 应用【相交】命令前后的效果对比·32·图3-16 应用【打孔】命令前后效果图3-17 应用【裁切】命令前后效果图3-18 选择需要合并的两条路径图3-19 合并后的路径3.2.5显示和隐藏路径3.2.6简化路径图3-20 执行【简化】命令的前后对比·33·3.3编辑对象3.3.1对象的选择3.3.2对象的复制与删除3.3.3 对象的变形3.3.4对象的排列和对齐3.4文本的应用3.4.1输入与修改文本图3-21 【文本工具】属性面板图3-22 字号、颜色等的设置图3-23 字体、字间距等的设置·34·3.4.2文本颜色、笔触、填充和效果的应用图3-24 字体颜色选择框图3-25 图案填充后的文本图3-26 设置透明后的效果·35·图3-27 【投影】菜单图3-28 投影设置对话框图3-29 字体设置投影特效后的效果3.4.3文本沿路径排列图3-30 制作文字和路径图3-31 执行【附加到路径】命令后的效果图3-32 文本沿路径的几种状态·36·3.4.4变形文本图3-33 文本进行几种变形后的效果3.4.5将文本转换为路径图3-34 文本原样·37·图3-35 选中路径中的单个文本图3-36 对文本变形后的效果3.5应用实例图3-37 立体图片效果图3-38 【层】面板图3-39 将下层的矩形变形图3-40 设置矩形填充类型·38·图3-41 设置填充颜色及不透明度图3-42 调节渐变工具的调节手柄图3-43 导入图像后的编辑窗口图3-44 月夜星空效果图3-45 两个圆部分交叠图3-46 选择【打孔】命令后得到的形状·39·图3-47 在编辑窗口中绘制星形图3-48 在编辑窗口中添加星形图3-49 【数值变形】对话框图3-50 任意调整大小后的星形3.6小结·40·。
网页设计与制作第3章.
教学进程
上机操作题
（1）在站点目录下新建文件table.htm，插入一个1行3列的表格， 插入logo、日期及Flash动画。 （2）制作水平分隔线。 （3）制作导航条，并书写文本。 （4）插入一个1行4列的大表格，根据给定的效果图再进行细化，添 加需要的文字及图片，得到最终的效果如下图所示。
教学进程
教学进程
3.1.2 编辑表格
选择单元格
选择单个的单元格 连续选择多个单元格 选择多个非连续的单元格 选择整个表格
教学进程
3.1.2 编辑表格
调整列的宽度和行的高度 方法一 将鼠标移动到表格的列边框或行边框上，当出现 “双箭头”形状的时候，就可以左右拖动来改变它 们的宽度或高度。 方法二 可以在属性面板中改变对应的参数
第
3章
表格的应用
3.1 创建及编辑表格 3.3 表格应用综合实例 3.1.1 创建表格 3.3.1 创建表格 3.1.2 编辑表格 3.3.2 插入Flash动画 3.2 表格的应用 3.4 习题与上机操作 3.2.1 细线表格效果的制作 3.2.2 格式化表格 3.2.3 分隔线的制作 3.2.4 虚线框表格的制作 3.2.5 导入表格数据 3.2.6 表格排序
方法
制作虚线框表格的一种最简单的方法，就是利用表格背景图片来 实现。
效果
教学进程
3.2.5 导入表格数据 导入表格式数据
可以将一些具有制表符、逗号、分号、引号或者其它分隔 符格式化好了的表格导入到网页文档中。
对于需要在网页中放置大量格式化数据的情况提供了更加 快捷、方便的方法。
教学进程
3.2.6 表格排序
执行【命令】|【排序表格】命令
教学进程
3.3 表格应用综合实例
《网页设计与制作》第三章插入网页基本元素精品PPT课件
loop设置循环次数，小于1为连续循环。
Bgcolor设置滚动区域的背景颜色。
width 和height设置滚动区域的大小，沿垂直方向（up或down）
滚动时，必须设置一定的高度值，否则看不到滚动的文字。
09.10.2020
11
设置文本超级链接
1.使用属性面板 设置超级链接
2.使用工具按钮
（1）插入超级链接 单击工具栏上的超级链接按钮
对话框。
（5）在代码中出现<marquee></marquee>，在中间的两个尖括号
09.10.“20>20<”之间输入要滚动的文字，如“欢迎访问励志学社的主页！” 。
10
设置滚动字幕的属性
<marquee direction=“right”scrollamount=“8”scrolldelay=“110”
（2）在下方的设计窗口中单击要插入滚动字幕的位置，此时注意查看代码 窗口中光标的位置。
（3）将插入工具栏设置为“常规”，单击标签选择器按钮，打开标签选择
器对话框。
（4）在标签选择器对话框左边窗口逐级选择“HTML标签”→ “页元
素”→“浏览器特定”，然后在右边窗口中单击“marquee”，再单击下
面的“插入”按钮，marquee标签被插入到代码中，按“关闭”按钮关闭
09.10.2020
26
3.设置单元格属性
❖ 文字（属性面板的上半部分） ❖ 水平 ❖ 宽、高 ❖ 垂直 ❖ 标题 ❖ 背景和背景颜色 ❖ 边框
loop=“2”Bgcolor=“#00ff00”Width=“200”Height=“100”> …………
</marquee>
网页设计与制作第3章
1．打开并编辑站点 2．删除站点 3．复制站点 4．导出和导入站点
3.4 新建网页
3.4.1 创建空白文档
3.4.2 页面属性的设置
1．设置外观（CSS）属性 2．设置链接（CSS）属性 3．设置标题（CSS）属性 4．设置标题和编码属性 5．设置跟踪图像属性
3.5 案例：制作第一个网页作品
3.6 实训：扬州的夏日
3.1.3 状态栏
3.1 Dreamweaver CS5的工作环境
3.1.4 属性检查器
执行“窗口”→“属性”或者直接按快捷键〈Ctrl+F3〉，即可以显 示或隐藏属性检查器。属性检查器中的选项内容是根据网页中选定元素类 型的不同而改变的，当用户在属性检查器中修改某个属性值后，其效果立 刻在“文档”窗口反映出来.
3.3.1 什么是站点
1．本地站点 本地站点指的是在用户本地计算机硬盘中构建用来存放整个网站框架的本 地文件夹。一般制作网页只需建立本地站点即可，用户在本地对各种文档 编辑后，再一并上传至Internet服务器中。 2．远程站点 在Dreamweaver的“文件”面板中，该远程文件夹被称为远程站点。远程 文件夹通常位于运行Web服务器的计算机上，具有与本地文件夹相同的名 称。也就是说，用户发布到远程文件夹的文件和子文件夹是本地创建的文 件和子文件夹的副本。
3.1 Dreamweaver CS5的工作环境
3.1.5 常用功能面板
1．“插入”面板 2．“CSS样式”面板
3.1 Dreamweaver CS5的工作环境
3.1.5 常用功能面板
3．“文件”面板 4．“框架”面板 5. “资源”面板
3.2 自定义工作环境
3.2.1 自定义工作区
1．新建工作区 2．重置工作区 3．管理工作区
3.4 新建网页
3.4.1 创建空白文档
3.4.2 页面属性的设置
1．设置外观（CSS）属性 2．设置链接（CSS）属性 3．设置标题（CSS）属性 4．设置标题和编码属性 5．设置跟踪图像属性
3.5 案例：制作第一个网页作品
3.6 实训：扬州的夏日
3.1.3 状态栏
3.1 Dreamweaver CS5的工作环境
3.1.4 属性检查器
执行“窗口”→“属性”或者直接按快捷键〈Ctrl+F3〉，即可以显 示或隐藏属性检查器。属性检查器中的选项内容是根据网页中选定元素类 型的不同而改变的，当用户在属性检查器中修改某个属性值后，其效果立 刻在“文档”窗口反映出来.
3.3.1 什么是站点
1．本地站点 本地站点指的是在用户本地计算机硬盘中构建用来存放整个网站框架的本 地文件夹。一般制作网页只需建立本地站点即可，用户在本地对各种文档 编辑后，再一并上传至Internet服务器中。 2．远程站点 在Dreamweaver的“文件”面板中，该远程文件夹被称为远程站点。远程 文件夹通常位于运行Web服务器的计算机上，具有与本地文件夹相同的名 称。也就是说，用户发布到远程文件夹的文件和子文件夹是本地创建的文 件和子文件夹的副本。
3.1 Dreamweaver CS5的工作环境
3.1.5 常用功能面板
1．“插入”面板 2．“CSS样式”面板
3.1 Dreamweaver CS5的工作环境
3.1.5 常用功能面板
3．“文件”面板 4．“框架”面板 5. “资源”面板
3.2 自定义工作环境
3.2.1 自定义工作区
1．新建工作区 2．重置工作区 3．管理工作区
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
标签(tag) 标签由3部分组成：<“标签名称” >。 “<”表示一个标签的开始，紧跟着的 是标签名和该标签的各种属性，最后用“>” 表示标签的结束。 例如：<A HREF=> “A”是标签名，“HREF”是标签的属性
标签(tag) 标签分为单标记指令和双标记指令，一 般情况下都是成对出现的，并且用“/”表示 标签之间的响应。 例如： <title>网页创作示例 </title> 注意：标签不要交叉嵌套
HTML中常用的段落标记有下面几个：
●段落标记<p>:段落起始和结尾的标记，基本 语法为：<p>…</p>. ●保留段落编辑标记<PRE>:如果文字编辑工具 已编排好一段内容，想直接依照原编排显示为 HTML文件，此时格式化段落内容的标记便派上 用场。用此标记，文字内容将以原编排的格式显 示出来。基本语法为：<PRE>…</PRE>。
3.4 表格
●单元格标记<td>：<td>标记用于定义 表格的单元格，表格有多少个单元格就有 多少个<td>…</td>标记。使用<td> 标记时，必须将其放在<tr>标记内。 ●标题单元格标记<th>：<th>标记用于 定义表格内的标题单元格，表明此单元格 中的文字将以粗体的方式显示。
3.4 表格
例： <p>通过使用现有的网页图像、声音、动画、文字 材料等资源，<br> 可以减轻网页制作的工作量、缩短工作时间、提高 工作效<br> 率，并且还可以在一定程度上弥补自身在某一方面 的不足。<br> </p>
3.2 页面排版的基本元素
3.2.1文件中标题标记（<title>）和字体 标记（<hx>）
3.2.3 设置段落标记
文字中的居中对齐标记<CENTER>:如果 需要将文件的段落或说明的各类标记文件 居中对齐，都可以使用居中对齐标记。基 本语法为： <CENTER>…</CENTER>。
使用此标记，浏览器能够根据窗口的大小 自动调整每行文字的居中显示。
段落缩进标记<BLOCKQUOTE>:如果段落需 要缩排，请直接在前后加上缩排标记。每使用一 次可以缩排数个空白字符，如果段落想缩排的更 多，重复使用此标记即可。基本语法为： <BLOCKQUOTE>…</BLOCKQUOTE>。
3.4.2 表格的属性
●<cellspacing>属性：功能是设置框线的宽 度。标记格式为： <table cellspacing=#>……</table>其 中，#为数字，单位是pixel（像素），默认值为 1。 <cellpadding>属性：功能是设置数据与边框 的宽度，标记格式为： <table cellpadding=＃>…</table>其中， #为数字，单位是pixel（像素），默认值为1。 ●<bgcolor>属性：功能是设置单元格的背景 颜色，标记格式为： <table bgcolor= #value>…</table>
3.2.3 设置段落标记
1.type数字形式属性
数字 小写字母 大写字母 小写罗马字母 大写罗马字母 Type=# Type=# Type=# Type=# Type=# #=1.2.3 #=a,b.c #=A,B,C #=I,ii,iii #=I,II,III
2.start 起始数字属性 <OL STRAT =#>,#代表起始数字
3.1.2 超文本文件格式的约定和限制
（1）由于WWW浏览器忽略超文本文件中的回车 符（除非用户指定用<PRE>标记元素限制按源文 件格式展示文本内容），而是用专门的标记符号 <BR>表示回车。 （2）由于WWW浏览器是按标记元素来控制超文 本显示效果的，所以源文件列宽不受限制，一个 文件的内容可以写在一行中，也可以写成习惯的 80列屏幕宽度，后者更便于源文件的阅读和修改。 （3）在超文本中用“/”表示路径，而不是DOS 系统中的反斜杠“\”。 （4）在超文本中可以用<IMG>标记元素插入图 形图像。
标号清单 标号清单就是清单 各项目左边加上数字 符号或其他有序的标 号，如a,b,c,并可设定 从何处开始计数，由 浏览器自动给予编号。
<OL> <L1> <L1> . . . <L1> </OL> „„. „„.
UL：无编号列表(Unnumbered List) OL：有编号列表(Unnumbered List) LI : 列表项目 (List Iterm)
标签的嵌套 <html> <head> <title>网页 创作示例</title> </head> <body> <p>用于教 学的示范网页。 </p> </body> </html>
错误的嵌套
<html>
<head>
<title>网页创 作示例</title>
</head> <body> <p>用于教学的 示范网页。</body> </p>
3.4.3 单元格属性
单元格属性指的是每一个表格中的格，体现在 HTML标记中就是<th>和<td>标记的属性设定， 主要有width，height，align，valign， bgcolor以及nowrap六项属性。 <width>属性：其功能是设定单元格的宽度， 单位是pixel。如： <th width= 100>产品名称</th> <height>属性：其功能是设定单元格的高度， 单位是pixel。如： <th height=30>产品名称</th>
3.4 表格
在HTML语法中，表格的建立由<table>，<tr>， <th>和<td>四个标记完成。下面是对这四个标 记的说明。 ●表格起始标记<table>：<table>标记用于 标识一个表格。一个表格是由<table>标记开始， </table>标记结束。表格的内容由<tr>、 <th>和<td>标记定义，表格的边框类型由 〈border=#〉标记属性指定，其中#为数字，默 认值为0。 ●表格行标记<tr>：<tr>标记用于定义表格 的一个行，表格有多少行就有多少个 <tr>…</tr>标记。在一个<tr>标记内可以包 含若干个由<th>和<td>标记所定义的单元格。
</html>
Html代码分类： 1、基本标志 2、链接标志 3、格式标志 4、帧标志 5、文本标志 6、表单标志 7、图像标志 8、声音标志 9、表格标志
3.1 HTML的基本结构
一个HTML文件应具有下面的结构： <html> HTML文件开始 <head> 文件头开始 文件头 </head> 文件头结束 <body> 文件体开始 文件体 </body> 文件体结束 </html> HTML文件结束
HTML的基本结构 页面排版的基本元素 清单列表的设计 表格 图片与多媒体 在网页中建立超链接 框架网页的学习 交互网页的制作
HTML HTML语言，又称超文本标记语言，是 英文HyperText Markup Language的缩 写。HTML语言作为一种标识性的语言，是 由一些特定符号和语法组成的，通过标签 来分割和标记文本中的各个元素。 网页就是HTML写的文档，可以在浏览 器中显示。
3.2.3 设置段落标记
3.3 清单列表的设计
清单用于列举事项,常用的清单有符号清单 和标号清单,清单允许嵌套 符号清单(包括“选择清单”和“说明式 清单”)项目左边无编号,而以特殊的符号 表示
3.3 清单列表的设计
清单前的符号可以由最外层标记中加入标 记属性type来控制, 格式为:<menu type =#>其中,#表示 符号名称,主要有以下三种: DISC------------实心圆点 Circle………….空心圆点 SQUARE……….实心方块.
网页设计与制作
第3章 HTML的认识
教学目的： 1、了解html语言 2、 熟悉html代码的基本标志、链接标 志、 格式标志、 帧标志、文本标志、表单 标志、图像标志、声音标志、表格标志 3、使用dreamweaver做出html页面
主要内容
3.1 3.2 3.3 3.4 3.5 3.6 3.7 3.8
一般来讲，HTML的的元素有以下3种表达 方式:
<标记>对象</标记> <标记 属性1=参数1 属性２=参数２>对 象</标记> <标记> 注意：语句中标记的书写不区分大小写。