湖北职院计科系

实验内容 1、练习文本和图片的基本操作 上一页 下一页

实验目的 1、掌握文本的基本操作 2、掌握图片的基本操作 上一页 下一页

实验重点 1、文本的基本操作 上一页 下一页

实验难点 1、图片的基本操作 上一页 下一页

①自动换行：在输入文字时，若某一行的长度超过了Dreamweaver窗口的显示范围，文字将自动换到下一行。 实验项目1:文本的基本操作 1．编辑文本 （1）换行 ①自动换行：在输入文字时，若某一行的长度超过了Dreamweaver窗口的显示范围，文字将自动换到下一行。 ②利用”Enter”键换行：在输入文字后按”Enter”键，文字成段，且上下段之间空一行。 ③利用”Shift+Enter”键换行：如果想要将文字手动换行，中间又不能出现空白行，可以按”Shift+Enter”键。 上一页 下一页

如果要在文档中查找或替找某个文字，选择”编辑”→ ”查找与替换”命令。 （2）插入特殊的字符 有时为了内容的需要，要在网页中插入一些键盘上没有的特殊字符，在Dreamweaver 8中，这些特殊字符可以通过”插入”→”HTML”→”特殊字符”命令来插入。 （3）删除、移动和复制文本 可以用工具按钮，也可以用菜单命令。 2．查找／替换文本的内容 如果要在文档中查找或替找某个文字，选择”编辑”→ ”查找与替换”命令。 上一页 下一页

3．设置文本格式 在Dreamweaver 4.0中设置文本格式可以通过属性面板，类似与Microsoft Word中对文本的属性设置，包括段落的格式、字体、字号、字的颜色、字体加粗／倾斜、对齐方式（左对齐／居中／右对齐）、文字所链接的路径或URL等。 范例1：将文件“实战演练1.txt”的内容拷贝到新网页中，将“内容提要”作为标题，居中对齐，“本书采用”“首先”“本书适用于”作为三个段落的起首，首行缩进2个汉字；“目录”作为一个标题，居中对齐，其以下的内容每章/节/小节都要换行，居左对齐。然后，将所有的“数据库”一词替换为“DATABASE”。 上一页 下一页

单击“插入”菜单下的“图像”按钮，如图1所示： 实验项目2:图片的基本操作 主要操作： 1.插入图像 单击“插入”菜单下的“图像”按钮，如图1所示： 上一页 下一页

在站点里面找到需要的图片，单击“确定”。 将弹出此对话框，如图2所示： 在站点里面找到需要的图片，单击“确定”。 上一页 下一页

选中图像后，在属性面板中就显示出了图像的属性，如3所示： 2、 设置图像的属性 选中图像后，在属性面板中就显示出了图像的属性，如3所示： 上一页 下一页

“宽”文本框用来设置图像的宽度，可填入数值，单位是像素。 “高”文本框用来设置图像的高度，可填入数值，单位是像素。 “图像”下的文本框用来设置图像的ID，一般情况下不填。 “宽”文本框用来设置图像的宽度，可填入数值，单位是像素。 “高”文本框用来设置图像的高度，可填入数值，单位是像素。 “源文件”用来设置这个图像的路径。 “链接”用来设置这个图像的超链接，“目标”用来设置超链接的打开方式，有关超链接的详细说明请参见后面章节的介绍。 上一页 下一页

“替代”文本框用来设置图像的替代文本，可输入一段文字，当图像无法显示时，将显示这段文字。 “垂直边框”文本框图用来设置图像上与其上方其他页面元素，及图像下与其正文其他页面元素的距离。 “水平边距”文本框是用来设置左侧与其左方其他页面元素，及图像右侧与其右方其他页面元素距离。 “边框”文本框图用来设置图像边框的宽度，可输入数值，单位是像素。默认图像边框宽度为“0”，也就是没有图像边框。 “低解析度源”用来设置这个图像还没显示品质代图像，当图像很大时，可以给图像设置一个较小的低品质替代图像。在图像还没显示出来之前，较小的低品质替代图像能迅速显示。 上一页 下一页

单击图像属性检查器中的按钮，即把图像设置成浏览器左对齐；单击图像属性检查器中的按钮，即把图像设置成浏览器居中对齐；单击图像属性检查器中的按钮，即把图像设置成浏览器右对齐；单击图像属性检查器中的按钮，即把图像设置成浏览器两端对齐。 上一页 下一页

3、调整图像在网页中的相对位置 范例2：用菜单和工具2种方法插入图片ji.jpg和daoying.jpg，同行并排，图片ji.jpg的高=200，宽=350，右对齐；daoying.jpg的高=200，宽=300，左对齐；然后用“裁剪”工具图片ji.jpg的光亮部分保留，去掉其左边不亮部分，再将其高=200，宽=350；将图片ji.jpg的亮度=20，对比度=25，锐化=5；图片shan.jpg,边框=2，垂直边距=150，水平边距=3。 上一页 下一页

上一页 下一页

实验项目3：文本和图片的混合操作 ，如图5所示： 图5 范例3原图 上一页 下一页

图6 范例3效果图 上一页 下一页

阿拉斯加（Alaska）: 格式:段落 字体:华文彩云 大小:36(px) 颜色:#000066 范例3：要求： 阿拉斯加（Alaska）: 格式:段落 字体:华文彩云 大小:36(px) 颜色:#000066 （Alaska）: 格式:段落 字体 Times New Roman 水平线: 宽: 80% 高:5 对齐:居中对齐 阴影:无 上一页 下一页

********************************************************** 在寒冷的阿拉斯加，不但可以看到晶莹剔透的冰雕、完全用冰盖起来的ICE HOTEL，还可以看到美丽的极光。你能想象住在完全由冰盖起来的旅馆里是什么感觉吗？ 格式:段落 字体 默认 大小:16(px) 颜色:#000000 *********************************************************** 冰雕: 格式:段落 字体:方正舒体 大小:36(px) 颜色: #FF6600 ICE HOTEL:格式:段落 字体:方正舒体 大小:36(px) 颜色: #FF3399 极光: 格式:段落 字体:方正舒体 大小:36(px) 颜色: #6699CC 上一页 下一页

*********************************************************** 极光是由于太阳风与极圈内的磁场产生反应而形成的光，它时而白色，时而是蓝色也有可能是五颜六色的。虽然阿拉斯加非常寒冷但是每年去那里的游客仍然络绎不绝，为的就是欣赏这难得一见的极光。 格式:段落 字体:方正舒体 大小:18(px) 颜色: #0033CC 极光: 格式:段落 字体: 华文彩云 大小:36(px) 颜色: #00FF00 寒冷: 格式:段落 字体:方正舒体 大小:36(px) 难得一见: 格式:段落 字体:方正舒体 大小:36(px) 上一页 下一页

*********************************************************** 谁也不会想到在寒冷的阿拉斯加竟然会有天然的室外温泉，在零下几十度的气温下，能够泡在温暖的温泉里喝上一杯咖啡，我想也是一件非常惬意的事情吧！ 格式:段落 字体:方正舒体 大小:18(px) 颜色: #0033CC 温泉 格式:段落 字体: 华文彩云 大小:36(px) 颜色: #FF9900 咖啡 格式:段落 字体: 华文彩云 大小:36(px) 事情 格式:段落 字体: 华文彩云 大小:36(px) 上一页 下一页

Shan.jpg: 宽:300 高:198 对齐:左对齐 亮度=1， 对比度=2，锐化=2，边框=1 图片处理:jiguang.jpg 宽:450 高:221 对齐:右对齐 亮度=-1，对比度=1，锐化=0 Shan.jpg: 宽:300 高:198 对齐:左对齐 亮度=1， 对比度=2，锐化=2，边框=1 【小结】 图文混排是常见的操作，而表格就是控制各元素的有力工具。 上一页 下一页

谢 谢！