第三章插入基本网页元素精品PPT课件
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
选中目录文字，在属性面板的链接栏输入“#”和锚记名称， 如“#a04”，即可将连接目标设置为锚记位置。
3.1.7 插入水平线
水平线可用于页面上内容的分隔。 将工具按钮切换到“HTML”，单击水平线按钮
单击该水平线，可在属性面板中设置水平线的属性，如宽 度、高度、对齐方式等。
3.2 页面中图像的处理
2.设置图象的基本属性
（1）改变图像大小 拖动图像上的3个控制点可以随意改变图像的大小，拖动时，属性面板
上的长、宽数值也作相应的改变。 （2）图文混排
图像和文字在同一行时，使用属性面板上的对齐属性可以设置图文的混 排方式。 （3）垂直边距和水平边距
垂直边距和水平边距栏设置图像和周围的文字的距离，单位为像素。
（5）在代码中出现<marquee></marquee>，在中间的两个尖括 号“><”之间输入要滚动的文字，如“欢迎访问励志学社的主页！” 。
2.设置滚动字幕的属性
direction为滚动的目标方向，可选right、left、up、 down。 scrollamount 和scrolldelay为滚动数量和延迟，可设 置滚动速度和间隔时间。 loop设置循环次数，小于1为连续循环。大于等于1的 值就表示滚动文字滚动的次数。 Bgcolor设置滚动区域的背景颜色。 Onmouseover和onmouseout用来设置当鼠标移入或
4.改变字体
选中文字后，打开“字体”下拉菜单，选择其中的一种字体，选中文 字后，单击按钮 将文字变为粗体，单击按钮 将文字变为斜体。
5.使用样式设置文字格式
样式是指对文字进行了大小、颜色设置后的综合的属性，以后再使用 需要将文字设置与某种样式相同的效果时，不需要一一设置颜色、大小等， 直接在样式列表中选择就可以了。
3.1.5 插入滚动字幕
1.插入滚动字幕
（1）单击编辑窗口上方的“拆分”按钮，将视图切换为拆分模式。
（2）在下方的设计窗口中单击要插入滚动字幕的位置，此时注意查看代码 窗口中光标的位置。
（3）将插入工具栏设置为“常规”，单击标签选择器按钮，打开标签 选择器对话框。 （4）在标签选择器对话框左边窗口逐级选择“HTML标签”→ “页元 素”→“浏览器特定”，然后在右边窗口中单击“marquee”，再单击下 面的“插入”按钮，marquee标签被插入到代码中，按“关闭”按钮关闭 对话框。
6.把文字变为标题
将光标放在一个段落的文字中任意位置，在属性面板的“格式”下 拉菜单中选择一个标题格式，可以将一个段落设为相应的标题样式。
7.设置段落对齐方式
将光标放在一个段落的文字中任意位置，单击左对齐，居中，右对齐 按钮。
8.列表
当显示多个相关的条目时，使用列表方式可以清楚地表示出各个条目 的并列关系。
使用[Shift]+[Enter]组合键和直接输入换行符。
（2）不换行空格和其他符号
Dreamweaver 8不能直接用空格键输入空格，必须用 [Ctrl]+[Shift]+[空格]组合键输入，或者通过插入特殊符号“不换行空 格”插入。
（3）转义符
将视图切换到“拆分”模式，可以看到空格、注册商标等特 殊符号用HTML代码表示时不是直接表示，而是用他们的转义符 表示 。
3.2.2 网页中图像的添加
1.插入图像
（1）把工具栏切换到“常用”状态，然后单击“图像：图象”按钮
（2）选择要插入的图像文件，在文件列表中单击一个图象文件时， 图象预览区会显示这个图象的缩略图。 （3）单击确定按钮，如果图像文件在站点文件夹中，就会直接插入 到网页中，同时在编辑窗口显示出图像。
将文件面板中的图像文件文件名直接拖动到编辑窗口中，也可以 将此图像文件插入到网页中。
3.1.2 设置文字属性
1.设置方法
使用组合键[Ctrl]+F3或菜单“窗口”“属性”打开属性面板。
2.改变文字大小
文本属性面板上的“大小”一项是用来设定文字大小的。
3.改变文字颜色
选中要改变颜色的文字，在属性面板中单击文本属性面板中的取色 器 ，在弹出的颜色面板上选择适当的颜色，可改变文字的颜色。
移出滚动区域时的操作。 This.stop() 表示停止；this.start()表示开始
3.1.6 使用锚记
1.设置锚记
在编辑窗口中单击要设置锚记的位置，在单击工具栏上 的插入锚记按钮
2.使用锚记
一般在页面顶部制作包含锚记的网页的目录，然后将目录 链接到锚记所在位置，浏览网页时单击该链接窗口可以直接跳 转到该位置。
第三章 网页的基本元素
3.1.1 页面字符的添加
输入文字
1. 插入文本 2. 插入特殊符号
将插入工具切换到“文本”工具组，最右边的工具按钮就是特殊符 号按钮，如图3.1所示。单击右边的三角形可打开字符选择菜单。
使用菜单“插入”→“HTML” →“特殊字符”，也可选择要插入的 字符插入到网页中。
（1）换行符
3.1.4 设置文本超级链接
1.使用属性面板设置超 级链接
2.使用工具按钮
（1）插入超级链接 单击工具栏上的超级链接按钮
注：若链接的对象在站点外部，必须输入目标的 完整的URL地址。如链接到百度：
（2）插入邮件链接 链接目标是电子邮件地址时，单击工具栏上的
电子邮件链接按钮
设置网页元素的链接目标
_blank：打开一个新窗口显示目标网页。 _parent：目标网页的内容在父框架窗口中显示。 _self：目标网页的内容在当前所在框架窗口中显示。 _top：目标网页的内容在最顶层框架窗口中显示。
3.2.1 网页中的图像
1.图像的作用
网页中的图像分为正文图像和装饰图像。
2.图像的格式
Dreamweaver 8和大多数浏览器一样支持使用JPEG和GIF 图像。
3.图像文件的保存
网页中的图像不和网页保存在一个文件中，而是单独的图像 文件。常见的是将装饰文件保存在images文件夹中，将正文图 像保存在pics文件夹中。
（4）图像替代 在图像替代栏输入图片的文字说明，当浏览器关闭图像显示时，图像方
框中会出现说明文字，当鼠标移动到图像上面时，也会显示替代文字。
（5）图像边框 在边框栏输入一个数字可设置图像的边框，默认的ຫໍສະໝຸດ Baidu框值为0。边框线
的颜色不能更改，通常将边框值设为1，可以美化图像
3.1.7 插入水平线
水平线可用于页面上内容的分隔。 将工具按钮切换到“HTML”，单击水平线按钮
单击该水平线，可在属性面板中设置水平线的属性，如宽 度、高度、对齐方式等。
3.2 页面中图像的处理
2.设置图象的基本属性
（1）改变图像大小 拖动图像上的3个控制点可以随意改变图像的大小，拖动时，属性面板
上的长、宽数值也作相应的改变。 （2）图文混排
图像和文字在同一行时，使用属性面板上的对齐属性可以设置图文的混 排方式。 （3）垂直边距和水平边距
垂直边距和水平边距栏设置图像和周围的文字的距离，单位为像素。
（5）在代码中出现<marquee></marquee>，在中间的两个尖括 号“><”之间输入要滚动的文字，如“欢迎访问励志学社的主页！” 。
2.设置滚动字幕的属性
direction为滚动的目标方向，可选right、left、up、 down。 scrollamount 和scrolldelay为滚动数量和延迟，可设 置滚动速度和间隔时间。 loop设置循环次数，小于1为连续循环。大于等于1的 值就表示滚动文字滚动的次数。 Bgcolor设置滚动区域的背景颜色。 Onmouseover和onmouseout用来设置当鼠标移入或
4.改变字体
选中文字后，打开“字体”下拉菜单，选择其中的一种字体，选中文 字后，单击按钮 将文字变为粗体，单击按钮 将文字变为斜体。
5.使用样式设置文字格式
样式是指对文字进行了大小、颜色设置后的综合的属性，以后再使用 需要将文字设置与某种样式相同的效果时，不需要一一设置颜色、大小等， 直接在样式列表中选择就可以了。
3.1.5 插入滚动字幕
1.插入滚动字幕
（1）单击编辑窗口上方的“拆分”按钮，将视图切换为拆分模式。
（2）在下方的设计窗口中单击要插入滚动字幕的位置，此时注意查看代码 窗口中光标的位置。
（3）将插入工具栏设置为“常规”，单击标签选择器按钮，打开标签 选择器对话框。 （4）在标签选择器对话框左边窗口逐级选择“HTML标签”→ “页元 素”→“浏览器特定”，然后在右边窗口中单击“marquee”，再单击下 面的“插入”按钮，marquee标签被插入到代码中，按“关闭”按钮关闭 对话框。
6.把文字变为标题
将光标放在一个段落的文字中任意位置，在属性面板的“格式”下 拉菜单中选择一个标题格式，可以将一个段落设为相应的标题样式。
7.设置段落对齐方式
将光标放在一个段落的文字中任意位置，单击左对齐，居中，右对齐 按钮。
8.列表
当显示多个相关的条目时，使用列表方式可以清楚地表示出各个条目 的并列关系。
使用[Shift]+[Enter]组合键和直接输入换行符。
（2）不换行空格和其他符号
Dreamweaver 8不能直接用空格键输入空格，必须用 [Ctrl]+[Shift]+[空格]组合键输入，或者通过插入特殊符号“不换行空 格”插入。
（3）转义符
将视图切换到“拆分”模式，可以看到空格、注册商标等特 殊符号用HTML代码表示时不是直接表示，而是用他们的转义符 表示 。
3.2.2 网页中图像的添加
1.插入图像
（1）把工具栏切换到“常用”状态，然后单击“图像：图象”按钮
（2）选择要插入的图像文件，在文件列表中单击一个图象文件时， 图象预览区会显示这个图象的缩略图。 （3）单击确定按钮，如果图像文件在站点文件夹中，就会直接插入 到网页中，同时在编辑窗口显示出图像。
将文件面板中的图像文件文件名直接拖动到编辑窗口中，也可以 将此图像文件插入到网页中。
3.1.2 设置文字属性
1.设置方法
使用组合键[Ctrl]+F3或菜单“窗口”“属性”打开属性面板。
2.改变文字大小
文本属性面板上的“大小”一项是用来设定文字大小的。
3.改变文字颜色
选中要改变颜色的文字，在属性面板中单击文本属性面板中的取色 器 ，在弹出的颜色面板上选择适当的颜色，可改变文字的颜色。
移出滚动区域时的操作。 This.stop() 表示停止；this.start()表示开始
3.1.6 使用锚记
1.设置锚记
在编辑窗口中单击要设置锚记的位置，在单击工具栏上 的插入锚记按钮
2.使用锚记
一般在页面顶部制作包含锚记的网页的目录，然后将目录 链接到锚记所在位置，浏览网页时单击该链接窗口可以直接跳 转到该位置。
第三章 网页的基本元素
3.1.1 页面字符的添加
输入文字
1. 插入文本 2. 插入特殊符号
将插入工具切换到“文本”工具组，最右边的工具按钮就是特殊符 号按钮，如图3.1所示。单击右边的三角形可打开字符选择菜单。
使用菜单“插入”→“HTML” →“特殊字符”，也可选择要插入的 字符插入到网页中。
（1）换行符
3.1.4 设置文本超级链接
1.使用属性面板设置超 级链接
2.使用工具按钮
（1）插入超级链接 单击工具栏上的超级链接按钮
注：若链接的对象在站点外部，必须输入目标的 完整的URL地址。如链接到百度：
（2）插入邮件链接 链接目标是电子邮件地址时，单击工具栏上的
电子邮件链接按钮
设置网页元素的链接目标
_blank：打开一个新窗口显示目标网页。 _parent：目标网页的内容在父框架窗口中显示。 _self：目标网页的内容在当前所在框架窗口中显示。 _top：目标网页的内容在最顶层框架窗口中显示。
3.2.1 网页中的图像
1.图像的作用
网页中的图像分为正文图像和装饰图像。
2.图像的格式
Dreamweaver 8和大多数浏览器一样支持使用JPEG和GIF 图像。
3.图像文件的保存
网页中的图像不和网页保存在一个文件中，而是单独的图像 文件。常见的是将装饰文件保存在images文件夹中，将正文图 像保存在pics文件夹中。
（4）图像替代 在图像替代栏输入图片的文字说明，当浏览器关闭图像显示时，图像方
框中会出现说明文字，当鼠标移动到图像上面时，也会显示替代文字。
（5）图像边框 在边框栏输入一个数字可设置图像的边框，默认的ຫໍສະໝຸດ Baidu框值为0。边框线
的颜色不能更改，通常将边框值设为1，可以美化图像