《专业》《网页设计与制作》第三章：插入网页基本元素

斜体 强调 块引用
标题
编号列表定义列表 定义说明 首字母缩写词
粗体 加强
段落 已编排格式
项目列表 列表项 定义术语 缩写 字符
插入网页基本要素之文本与样式
添加空格和段落
插入空格
空格的添加：HTML只允许字符之间包含一个空格；若要在文档中 添加其他空格，必须添加连续空格。
（1）空格的HTML代码为：  （2）在“插入”栏中，选择“文本”，然后单击最右侧下拉列表框中“不 换行空格”。 （3）选择“插入”>“HTML”>“特殊字符”>“不换行空格”。 （4）按 Ctrl+Shift+空格键 （首选）。
插入网页基本要素之文本与样式
层叠样式的应用
CSS样式面板
显示“CSS样式”面板：在“窗口”菜单中单击“CSS 样式”，或 者按 Shift+F11 键。CSS样式面板下方的四个按钮分别是：附加样 式表，新建CSS样式，编辑样式表，删除CSS样式表。
（1）将插入点置于欲设格式处，单击新建 CSS样式按钮。 （2）定义CSS样式的类型； （3）选择定义样式的位置； （4）单击“确定”。出现“CSS样式定义” 对话框。 （5）选择要为新CSS样式设置的样式选项。
插入网页基本要素之文本与图像
层叠样式的应用
插入网页基本要素之文本与图像
层叠样式的应用
插入网页基本要素之文本与图像
层叠样式的应用
CSS样式可以保存成一个独立的外部样式文件，使得多个网页文件可以共享同一CSS样式，以便统一网 页的格式。 CSS样式文件的扩展名是CSS，是一个纯文本文件。 CSS样式面板中单击附加样式按钮，可以将一个现成的样式链接到当前网页中使用。

文本字段 1.单行文本 1.单行文本在表单中输入“用户名”，在单击工具栏上的文本字段按钮 2.密码 2.密码密码输入区用于用户输入密码信息，用户在此区域输入的所有字符都显示为“*” 或黑点。

3.多行文本 3.多行文本在单击工具栏上的文本区域按钮 2011-9-6 46
复选框单击工具栏上的复选框按钮单选按钮 1.单选按钮 1.单选按钮单击工具栏上的单选按钮按钮 2.单选按钮组 2.单选按钮组单击工具栏上的单选按钮组按钮2011-9-6 47
下拉菜单 1.列表/ 1.列表/菜单列表单击工具栏上的列表/菜单按钮 2.跳转菜单2.跳转菜单在工具栏上单击跳转菜单按钮 2011-9-6 48
隐藏区域在工具栏上单击隐藏域按钮在网页中插入一个隐藏域标志按钮在工具栏上单击按钮按钮 2011-9-6 49。

多媒体内容
随着网络的发展，多媒体在网络上得到了更广泛的 应用，因此，对网页设计页提出了更高地要求。在 Dreamweaver中，可以快速、方便地为网页添加
Flash动画、音频文件、视频文件，
插入这些对象可以增强网页的互动性。
插入网页基本要素之多媒体内容
插入Flash动画
目前，Flash动画使网页上最流行的动画格式，大量用于网页中。在Dreamweaver中，Flash动画也是最常用的多媒体 插件之一，它将声音、图像和动画等内容加入到一个文件中，并能制作较好的动画效果，同时还使用了优化的算法将 多媒体数据进行压缩，是文件变得很小，因此，非常适合在网上传播。
插入网页基本要素之多媒体内容
音频格式

1 midi 或 mid （ 乐 器 数 字 接口）格式：用于器乐。许
多浏览器都支持MIDI文件并且不 要求插件。尽管其声音品质非常 好，但根据访问者的声卡的不同， 声音效果也会有所不同。
5
mp3格式
一种压缩格式，它可令声音文件明显缩小。 其声音品质非常好：如果正确录制和压缩 MP3文件，其质量甚至可以和CD质量相 媲美。
2 wav（ Waveform扩展名）格式： 具有较好的声音品质，许多浏览器都支持此类 格式文件并且不要求插件。可以从CD、磁带、 麦克风等录制自己的WAV文件。
3 aif（音频交换文件格式，即
AIFF）格式：与WAV格式类似，
也具有较好的声音品质，大多数浏览器
4
都可以播放它并且不要求插件。
ra、ram、rpm或RealAudio格式：具
插入网页基本要素之多媒体内容
插入Flash动画
方法：将插入点置于欲添加位置，在“插入栏”中，选择“媒体”，单击“Flash”图标；或在站点管理 器中将“Flash”文件拖到文档窗口中；或者执行“插入/媒体/Flash”菜单。

插入网页基本要素之图像与超链接
超链接
超级链接是网页中的精华部分，当光标移至浏览器中的超级链接时，光
标会变成一只手的形状，此时单击链接便可以打开链接所指向的目标网
页。
没有它每个网页都要输入很长的URL地址。没有超链接，就无法通过单击的方式 遨游Web世界，而如果没有了单击的功能，Web就会是死水一潭。
在左边选择文件类型，右边单击左上方的加号图像编辑器
设置及启用外部图像编辑器：
设置不同类型图像文件编辑器：选择“编辑／ 首选参数／文件类型/编辑器”…… 通过外部图像编辑器对图像文件进行修改:
启用图像编辑器：选取图像→单击属性面板中 的“编辑”按钮即可启动相应编辑器，并打开 图像文件，进行修改。
插入网页基本要素之图像与超链接
插入网页基本要素之图像与超链接
图像的编辑与属性设置
单击选中图像，在属性面板中，设置图像的属性： 给图片增加提示：选中图像→在属性面板的“替代”中输入提示文字，在浏览器中，鼠标指向这个图片时，就会出现文字提示。 另外，有时，不显示图片后，可以显示该说明文字。
插入网页基本要素之图像与超链接
图像的编辑与属性设置
插入网页基本要素之图像与超链接
超链接的类型
1 页间链接：利用该链接可 以跳转到其他文档或文件，如图 形、电影、PDF或声音文件。
2 页内链接：也被称为锚记链接，利用它 可以跳转到本站点指定文档的位置。
4 空链接及脚本链接
它允许用户附加行为至对象或创 建 一 个 执 行 JavaScript 代 码 的 链 接。
插入网页基本要素之图像与超链接
图像的编辑与属性设置
单击选中图像，在属性面板中，设置图像的属性： 放大、缩小图像大小：拖动控制点或直接在属性面板中输入宽度与高度的像素值； 等比例放大、缩小图像大小：按住Shift同时拖动右下角控制点； 恢复图像大小：删除其属性面板中的宽度、高度值，即可恢复到原来的大小。 “边框”是以像素为单位的图像边框的宽度。默认为无边框，相当于加一个相框。 “编辑”启动在“外部编辑器”参数选择中指定的图像编辑器并打开选定的图像。