Dreamweaver静态网页制作过程.pptx
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
f)Visited Links（访问过的链接） 这里可以设置文档页面中已经访问过的超级 链接的文字颜色，实际上设置的是<body>标记的vlink属性。
Dreamweaver静态网页制作(续)
g)Active Links（正在访问的链接） 这里可以设置文档页面中正在访问 的超级链接的文字颜色，实际上设置的是<body>标记的alink属性。 h)Left Margin（左边距）、Top Margin（上边距）、Margin Width（ 页边宽度）和Margin Height（页边高度） 在这些文本框中，可以设置页面 文字同页面边缘的间距。实际上分别设置的是<body>标记的leftmargin、 topmargin、marginwidth和marginheight属性。但要注意，Netscape可以 识别这些属性，但是Internet Explorer不识别它们，因此不建议使用它们。 i)Document Encoding（文档解码方式） 在该列表框中，可以选择当前文档 页面的文字解码方式，对于大陆使用的中文网页，应该选择“Simplified Chin ese（GB2312）”。如果这里没有需要的解码方式，可以从列表中选择“Othe r”，这种情况下，页面会使用浏览器运行环境的解码方式。 j)Tracing Image（草稿图） 在该文本框中，可以指定一幅图像作为网页创 作时的草稿图，它显示在文档的背景上，便于在网页创作时进行定位和安放 对象。在实际生成网页时，它并不显示在网页中，我们会在后面介绍其使用方法。 k)Image（图像） 拖动该滑块，可以改变草稿图的透明程度，使用适当 的透明程度可以避免干扰网页的编辑。
所涉及到的图像操作的主要有： a)在网页中插入图片（可利用菜单或对象面板来实现） b)在网页中插入一图片，并作为背景（注意其中背景图片的应用技巧）； c)在网页中某个位置插入一个交互图像（举例说明）
Dreamweaver静态网页制作(续)
对象面板标准页插入鼠标经过时的图像即可 d)插入导航栏：“插入”“交互式图像”导航栏
Dreamweaver静态网页制作(续)
4、图像处理 图像和文本是网页中最重要的两种基本元素。 主要有：jpeg、gif、png格式的图像 Jpg:是存储照片或连续色调图像的较好格式； Gif：存储非连续色调图象或颜色比较单一的图象。最多支持256种色，可以以 动、静态两种方式出现。 Png：拥有GIF的全部特性（如透明图、GIF动画等），是一种很好的网上图 像文件格式。它避开了GIF的压缩程序专利，而且可以得到比GIF更好的压缩 比，可以用来代替GIF，是一种无损压缩图像，以后Internet的主要图片格式 （基于B/S模式）。
Dreamweaver静态网页制作
一、FTP的使用（文件传输） 1、直接通过浏览器的方法来实现 输入账号、密码登录到FTP服务器上，然后即可用复制的方法将 文件复制到FTP服务器上。 2、使用相应的应用软件来实现 如：CuteFTP LeapFTP来实现 二、检验网页的方法 方法一： 1、page.gdei.edu.cn/page/registeruser.asp 2、输入账号、密码以及其它的相关信息 3、申请完成之后，可以用IP、账号、密码来登录到服务器，将本
c)Background（背景） 在这里可以为文档页面指定背景颜色。实际上设置的 是<body>标记的bgcolor属性。
d)Text（文本） 这里可以设置文档页面中文字的前景颜色，实际上设置的是 <body>标记的text属性。
e)Links（链接） 这里可以设置文档页面中尚未访问过的超级链接的文字颜色， 实际上设置的是<body>标记的link属性。
Dreamweaver静态网页制作(续)
3、百度文库档页面的整体设置
a)Title（标题） 在该文本框中，可以输入文档的页面标题，它实际上是输入 位于HTML头部的<title>和</title>标记之间的内容，在浏览页面时，会显 示在浏览器的标题栏上。
b)Background Image（背景图像） 在该文本框中，可以输入希望用作HTML 文档的背景图像的路径和文件名称，单击“Browse”（浏览）按钮，可以 从磁盘上选择图像文件。这里不仅可以输入本地图像文件的路径和文件名 称，也可以用URL的形式输入其他位置的图像名称。实际上，这里设置的 是<body>标记的background属性。
Dreamweaver静态网页制作(续)
内部链接：在同一网站文档之间的链接 外部链接：在不同网站文档之间的链接 锚点链接：同一网页或不同网页的指定位置的链接； E-mail链接：打开填写电子邮件表格的链接； 2）文档的路径（URL） 相对路径： 绝对路径：完整的URL （基于目录的路径）：从根目录出发 3）链接的方法 在属性面板中可以直接使用 可以选择被链接文档的载入位置 _blank：新的未命名的浏览器窗口中； _parent：父框架集或包含该链接的框架窗口中； _self：相同的窗口中（是无需指定的） _top：整个浏览器窗口并删除所有框架； 可以借助于样式表来实现
Dreamweaver静态网页制作(续)
Dreamweaver静态网页制作(续)
三、基本操作 1、编缉文本 1）添加文本的方法是一种是直接在文档窗口中键入文本内容，另一种是在文
档窗口中，将插入点设置到要放置文本的地方，打开Edit下拉菜单，将文 本导入。 2）编缉文本（大小、颜色、字体、样式） 可以直接通过属性面板来实现或通过选择“文本字体”来设置 2、超链接 创建超链接最常见的做法是将超链接信息设置在文本及图像上。使其链接至其 它的网页或网站上。源端点和目标端点 目标端点有：图片、电子邮件地址、多媒体文件、程序（如： javascript:window.close()关闭当前窗口 javascript:windows.print()打印 文 档 1）链接的类型
5、表格处理 是页面布局极为有用的工具。往往用表格来定位页面元素。
Dreamweaver静态网页制作(续)
g)Active Links（正在访问的链接） 这里可以设置文档页面中正在访问 的超级链接的文字颜色，实际上设置的是<body>标记的alink属性。 h)Left Margin（左边距）、Top Margin（上边距）、Margin Width（ 页边宽度）和Margin Height（页边高度） 在这些文本框中，可以设置页面 文字同页面边缘的间距。实际上分别设置的是<body>标记的leftmargin、 topmargin、marginwidth和marginheight属性。但要注意，Netscape可以 识别这些属性，但是Internet Explorer不识别它们，因此不建议使用它们。 i)Document Encoding（文档解码方式） 在该列表框中，可以选择当前文档 页面的文字解码方式，对于大陆使用的中文网页，应该选择“Simplified Chin ese（GB2312）”。如果这里没有需要的解码方式，可以从列表中选择“Othe r”，这种情况下，页面会使用浏览器运行环境的解码方式。 j)Tracing Image（草稿图） 在该文本框中，可以指定一幅图像作为网页创 作时的草稿图，它显示在文档的背景上，便于在网页创作时进行定位和安放 对象。在实际生成网页时，它并不显示在网页中，我们会在后面介绍其使用方法。 k)Image（图像） 拖动该滑块，可以改变草稿图的透明程度，使用适当 的透明程度可以避免干扰网页的编辑。
所涉及到的图像操作的主要有： a)在网页中插入图片（可利用菜单或对象面板来实现） b)在网页中插入一图片，并作为背景（注意其中背景图片的应用技巧）； c)在网页中某个位置插入一个交互图像（举例说明）
Dreamweaver静态网页制作(续)
对象面板标准页插入鼠标经过时的图像即可 d)插入导航栏：“插入”“交互式图像”导航栏
Dreamweaver静态网页制作(续)
4、图像处理 图像和文本是网页中最重要的两种基本元素。 主要有：jpeg、gif、png格式的图像 Jpg:是存储照片或连续色调图像的较好格式； Gif：存储非连续色调图象或颜色比较单一的图象。最多支持256种色，可以以 动、静态两种方式出现。 Png：拥有GIF的全部特性（如透明图、GIF动画等），是一种很好的网上图 像文件格式。它避开了GIF的压缩程序专利，而且可以得到比GIF更好的压缩 比，可以用来代替GIF，是一种无损压缩图像，以后Internet的主要图片格式 （基于B/S模式）。
Dreamweaver静态网页制作
一、FTP的使用（文件传输） 1、直接通过浏览器的方法来实现 输入账号、密码登录到FTP服务器上，然后即可用复制的方法将 文件复制到FTP服务器上。 2、使用相应的应用软件来实现 如：CuteFTP LeapFTP来实现 二、检验网页的方法 方法一： 1、page.gdei.edu.cn/page/registeruser.asp 2、输入账号、密码以及其它的相关信息 3、申请完成之后，可以用IP、账号、密码来登录到服务器，将本
c)Background（背景） 在这里可以为文档页面指定背景颜色。实际上设置的 是<body>标记的bgcolor属性。
d)Text（文本） 这里可以设置文档页面中文字的前景颜色，实际上设置的是 <body>标记的text属性。
e)Links（链接） 这里可以设置文档页面中尚未访问过的超级链接的文字颜色， 实际上设置的是<body>标记的link属性。
Dreamweaver静态网页制作(续)
3、百度文库档页面的整体设置
a)Title（标题） 在该文本框中，可以输入文档的页面标题，它实际上是输入 位于HTML头部的<title>和</title>标记之间的内容，在浏览页面时，会显 示在浏览器的标题栏上。
b)Background Image（背景图像） 在该文本框中，可以输入希望用作HTML 文档的背景图像的路径和文件名称，单击“Browse”（浏览）按钮，可以 从磁盘上选择图像文件。这里不仅可以输入本地图像文件的路径和文件名 称，也可以用URL的形式输入其他位置的图像名称。实际上，这里设置的 是<body>标记的background属性。
Dreamweaver静态网页制作(续)
内部链接：在同一网站文档之间的链接 外部链接：在不同网站文档之间的链接 锚点链接：同一网页或不同网页的指定位置的链接； E-mail链接：打开填写电子邮件表格的链接； 2）文档的路径（URL） 相对路径： 绝对路径：完整的URL （基于目录的路径）：从根目录出发 3）链接的方法 在属性面板中可以直接使用 可以选择被链接文档的载入位置 _blank：新的未命名的浏览器窗口中； _parent：父框架集或包含该链接的框架窗口中； _self：相同的窗口中（是无需指定的） _top：整个浏览器窗口并删除所有框架； 可以借助于样式表来实现
Dreamweaver静态网页制作(续)
Dreamweaver静态网页制作(续)
三、基本操作 1、编缉文本 1）添加文本的方法是一种是直接在文档窗口中键入文本内容，另一种是在文
档窗口中，将插入点设置到要放置文本的地方，打开Edit下拉菜单，将文 本导入。 2）编缉文本（大小、颜色、字体、样式） 可以直接通过属性面板来实现或通过选择“文本字体”来设置 2、超链接 创建超链接最常见的做法是将超链接信息设置在文本及图像上。使其链接至其 它的网页或网站上。源端点和目标端点 目标端点有：图片、电子邮件地址、多媒体文件、程序（如： javascript:window.close()关闭当前窗口 javascript:windows.print()打印 文 档 1）链接的类型
5、表格处理 是页面布局极为有用的工具。往往用表格来定位页面元素。