网页设计教程 教学课件 作者 裴献第4章 插入和编辑网页基本元素.ppt

《网页设计教程 教学课件 作者 裴献第4章 插入和编辑网页基本元素.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章插入和编辑网页基本元素教学目标掌握文本的插入、属性的设置掌握图像的插入、属性的设置掌握Flash的插入、属性的设置掌握多媒体的插入、属性的设置了解其他网页元素的插入、属性的设置4.1插入文本与修改属性4.1.1插入文本1、直接输入文本HTML只允许字符之间包含一个空格，若要在文档中连续输入多个空格，则可按照如下方法进行操作：（1）在中文输入法的全角状态下输入空格。（2）使用快捷键Ctrl+Shift+空格。（3）选择“编辑”菜单中的“首选参数”，打开“首选参数”对话框，在“常规”类别中选中“允许多个连续的空格”选项。2、复制文本3、导入文档4.1.2设置文本属性1．字体设置2

2、．字号设置3．颜色设置4．标题格式5．段落格式设置6．应用列表1．字体设置有时设置字体时，在文本的“属性”面板中，默认没有显示所需要的字体，此时则需要将使用的某种字体添加到字体列表中。2．字号设置通过“属性”面板中的“大小”下拉按钮，用户可以根据设计需要选择合适的文本字号，来对选中文本进行设置字号大小。3．颜色设置网页中文本的颜色默认是黑色，但是为了使文本颜色符合网页设计风格，达到更好的视觉效果，则可以按照要求设置文本的颜色。单击“属性”面板中的“文本颜色”按钮，此时鼠标变成“吸管”形状，然后在打开的颜色选择器中选择所需要的字体颜色。4．标题格式通常情况下，网页中文本标题是文本内容

3、的主题，因此对标题格式的设置也是不可缺少的。5．段落格式设置段落格式化是指对选定的段落进行排版，主要包括该段落的对齐、缩进、行间距、段间距等，要对某个段落进行处理，需要先将光标定位于该段落中。（1）段落的对齐方式段落的对齐方式有以下四种：左对齐、右对齐、居中对齐和两端对齐。在Dreamweaver中默认的是左对齐，可以根据用户需要来设置相应的对齐方式，先选中所需对齐的文本，或把光标置于该文本的开头处，然后单击“属性”面板中相应的对齐按钮即可。（2）段落缩进在“属性”面板的对齐方式下方有两个按钮，“文本凸出”和“文本缩进”，单击它们就能实现文本的缩进，单击一次移动两个单位，并且会将<

4、blockquote>标签应用于文本段落。（3）段落间距段落间距包括段间距和行间距，在DreamweaverCS3中，提供了三种方式添加段落间距，即进行文本换行。①自动换行：输入文本时，当一行的长度超多屏幕显示的范围，文字将自动在下一行进行显示。②使用Enter键：按回车键时会自动添加一个新的段落，段落间出现一个空白行。③使用Shift+Enter键：同时按下这两个按键，插入换行符，不会添加新的段落，两行之间也不会出现空白行。6．应用列表（1）应用项目列表如果网页中的文本内容不需要按顺序排列时，则使用项目列表。使用“属性”面板上的“项目列表”按钮进行设置。（2）应用编号列表当网页中

5、的文本内容需要进行按顺序排列时，则使用编号列表。使用“属性”面板上的“编号列表”按钮进行设置。（3）设置列表属性应用了列表之后可以更改列表的类型、样式及编号列表的计数等。可以单击“文本”菜单中的“列表”选项中的“属性”，打开“列表属性”对话框进行修改。列表类型：有四种，项目列表、编号列表、目录列表和菜单列表样式：设置列表每行前面的列表符号。开始计数：设置编号列表每行开始的编号。4.2插入图像与修改属性4.2.1插入图像插入图像是一个非常简单的操作，只需要将光标定位在需要插入图像文件的位置，然后执行下列操作之一。方法一：选择菜单“插入记录”→“图像”命令方法二：在“常用”工具栏中，单

6、击“图像”按钮右边的三角按钮，在下拉列表中选择“图像”4.2.2修改图像属性1．图像的基本属性（1）宽和高：以像素为单位指定图像的宽度和高度，用来设置图像的大小。（2）源文件：指定图像的源文件，设置引用图像的路径。（3）链接：设置图像的超级链接。（4）替换：与在“图像标签辅助功能属性”对话框设置的效果相同，对于某些浏览器，在浏览网页时鼠标移动到图像上时显示的文字。1．图像的基本属性（5）地图和热点工具：设置热区。（6）垂直边距和水平边距：以像素为单位，设置图像边沿的边距。“垂直边距”沿图像的顶端和底部；“水平边距”沿图像的左侧和右侧。（7）边框：以像素为单位，图像边框的宽度，默认为

7、无边框。（8）对齐按钮：在边框右侧的三个按钮，左对齐、居中和右对齐，设置图像相对浏览器的左对齐、居中或右对齐。（9）对齐：对齐同一行上的图像和文本，设置图像和文本的排版方式。各对齐方式的含义对齐方式含义默认值根据访问者浏览器的不同，但通常指定基线对齐。基线、底部将文本基准线（或同一行的其他元素）对齐选定对象的底部。顶端、文本上方将选定图像的顶端与当前行最高项（图像或文本）的顶端对齐居中将图像的中部与当前行的基线对齐绝对居中将图像的中部与当前行文本的中部对齐绝对底部将图