Presentation is loading. Please wait.

Presentation is loading. Please wait.

湖北职院计科系.

Similar presentations


Presentation on theme: "湖北职院计科系."— Presentation transcript:

1 湖北职院计科系

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

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

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

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

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

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

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

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

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

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

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

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

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

15 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。 上一页 下一页

16 上一页 下一页

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

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

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

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

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

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

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

24 谢 谢!


Download ppt "湖北职院计科系."

Similar presentations


Ads by Google