《网页设计与制作应用教程》课件——CH4 插入基本网页.pptxVIP

第3版HTML5DreamweaverPhotoshopCSS3AnimateAdobeCC网页设计与制作应用教程

网页设计与制作第4章插入基本网页元素

本章重点页面属性设置插入与编辑页面基本元素创建超链接

四、插入基本网页元素4.1页面属性设置4.3图像插入与编辑4.2文本插入与编辑4.4多媒体插入与编辑4.5超链接4.6应用列表

4.1页面属性设置4.1页面属性设置大多网站的页面会设置固定的色彩或图像作为背景，这些如字体、背景颜色和背景图像等外观属性特征可以通过设置网站的页面属性来控制。

4.2.1在网页中插入文本文本是网页中的重要元素，在Dreamweaver的“设计”视图可以直接输入文本内容，类似在Word文档中输入文本。当然，也可以导入其他编辑器中已有的文本，从而快速创建文档内容。4.2.3插入滚动文本在网站页面中，插入滚动文字可以增强视觉流动性，突出显示文字内容。实际上，通过插入marquee标签可以实现该功能。4.2.2编辑文本1.标题级样式设置2.文本格式设置4.2文本插入与编辑

说明:direction:设置滚动方向#的取值有left,right,up,down?，默认是left，即从右至左。bgcolor:设置滚动区域的背景色。?height:设置滚动区域的高度?。width:设置滚动区域的宽度?。scrollamount:设置每次移动速度，数值越大移动越快。scrolldelay:设置每一次滚动停顿时间，单位是毫秒（ms），时间越短滚动越快。loop：设置文字滚动次数，默认为无限次。align：设置滚动文字与屏幕的垂直对齐方式，取值top、middle、bottom。hspace：设置字幕左右空白区域。vspace：设置字幕上下空白区域。h1align=center学nbsp;校nbsp;简nbsp;介/h1marqueewidth=1000不忘初心牢记使命立德树人育警铸剑/marqueehr4.2文本插入与编辑

4.3图像插入与编辑图像与文字一样，都是网页构成的基本元素。图像可以更好的表现主题，避免纯文本的单调，以丰富、美观的信息来吸引更多的访问者。Dreamweaver可以直接显示“GIF”、“JPEG”或“PNG”格式的图片。4.3.1插入图像1)打开网页“page406.html”，页面是准备插入图像的半成品。或者新建一个空白网页。2)光标插入点指定在正文段落前面，单击Enter键空出一行。选择主菜单【插入】/【image】命令，在弹出的对话框中选择图像文件名，单击“确定”按钮，则图像按原始尺寸大小插入到页面中。4.3.2编辑图像调整图像的大小、高度和宽度等。

4.4多媒体插入与编辑使用Dreamweaver可以在网页中快速插入各种类型的音频、视频、动画等多媒体控件。多媒体元素使得网页内容更加丰富多彩。这些元素添加到页面时，在Dreamweaver的编辑窗口是不能直接浏览的，它只是一个占位图标，在浏览器窗口才能听到或看到播放效果。主菜单【插入】/【HTML】中包括了各种类型的执行命令。添加音频添加视频添加Flash动画

4.5超链接所谓超链接是指从一个网页指向一个目标的连接关系，这个目标可以是另一个网页,也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。可以说超链接是互联网技术能够得以飞速普及的关键。4.5.1超链接的分类外部链接内部链接锚记链接E-mail链接空链接脚本链接4.5.2创建超链接_blank（或者_new）将链接的文档载入一个新的、未命名的浏览器窗口(_blank即将在新标准中被废除)。_parent：将链接的文档载入该链接所在框架的父框架或父窗口。如果包含链接的框架不是嵌套框架，则所链接的文档载入整个浏览器窗口。_self：将链接的文档载入链接所在的同一框架或窗口。此目标是默认的，所以通常不需要指定它。_top：将链接的文档载入整个浏览器窗口，从而删除所有框架。

4.6应用列表列表分为项目列表和编号列表两种，项目列表也称为无序列表，编号列表也称为有序列表。在“设计”视图中，鼠标直接拖拽选中所有正文文本（不含题目），然后在属性检查器中单击项目或编号列表符号。项目列表可以使用符号或图形来对没有顺序的文本进行排列，通常使用项目符号作为列表项的前缀，如圆点（?）、方块（?）等符号作为列表符号。编号列表是以数字编号来对一组文本进行排列，通常使用一种数字符号作为列表前缀，各项目之间存在顺序和级别之分。

本章小结静态网页设计的基础工作不外乎是将文本、图像等信息添加组织到网页中。本章介绍了使用Dreamweaver在网页中插入各种类型页