DREAMWEVAER MX 2004 入门

DREAMWEVAER MX 2004DREAMWEVAER MX 2004 入门入门

楼斌 BBS ID ： lou 生命科学学院 2005.01.11

建议学习方式先从最简单的 HTML 网页入手；

选择 Dreamweaver 作为你的网页制作工具；选择 Photoshop 作为你的网页制作工具；粗略地阅读本站的 Dreamweaver 及 Photoshop 教程，了解这两个软件到底能做些什么；

初级阶段：此时的你，已经掌握了 Dreamweaver 和 Photoshop 的基本操作；策划和制作你的第一个网站；不断为你的网站增加内容与功能（例如尝试将一些 Java Script 小程序添加到你的网页中）；粗略阅读本站 HTML 及 CSS 的语法书，并尝试运用到你做的网页中。　　

进阶阶段：此时的你，已经具有一定的网页制作经验，并逐步形成了自己一套的对于网页制作的理解，制作一般的网页已经不在话下 ; 根据个人喜好及实际需要，网页制作的方向，你可以向美术设计的方向发展，学习一些美术方面的知识；也可以向网络编程的方向发展，学习 ASP 等编程语言；也可以向信息制作的方向发展，锻炼自己在网站策划及信息采辑的技能；常识制作其他不同类型的网站，从模仿别人开始，都逐渐形成自己的设计风格；熟练操作 Dreamweaver 及 Photoshop 两个软件，并至少能读懂 HTML 及 JavaScript 。

高手阶段：此时的你，至少在美术设计、程序编写、或信息制作方面有一定的造诣：

建议学习方式

网站制作流程

→ → →新建站点站点文件命名定义页面属性→ → →插入表格定义页面大小添加内容插入导航

→ → →条添加链接使用代码片断定义及应用 CSS→ →添加动态交互链接站点各个页面。

建立一个网站，首先要在本地机器上做好网站，再传到网上的虚拟空间上。

在 D 盘新建一个文件夹，输入你想要的站点名称，这里输入 test ，其实可以任意输入名称的，要注意的是，尽量不要用中文命名，以免出现意想不到的麻烦！

在 Dreamweaver 中定义站点

建立站点

1

2

接下来需要给站点起一个名字，可以起任意一个名字。这里起名为 abc, 按下一步

选择是否使用服务器技术。因为实例建立的是一个静态站点，就

“选择否，我不想使用服务器

” 技术。

一个站点就定义好了。

站点定义好之后，就要开始新建网页文件和文件夹了，在站点中点击右键，选择新建文件。

选创建

窗口和面板

代码区

所见即所得

Body 区，网页主体

Head区，主要设置字体编码，网页标题等

在正式开始制作网页前一个必不可少的工序。双击打开刚才新建的 index.htm ，就自动转入编辑窗口。选择“修改” > “ 页面属性”设置一些必要的页面属性。　　① Title （标题）：页面的标题会直接显示在浏览器的左上方，务必要养成为每一页都设定一个标题的习惯，这既便于访问者的浏览，也有助于你在网页编辑的过程中区分不同的页面。虽然标题并不是一个网页必要的元素，但却是体现着网页制作者有否从细处为浏览者着想。　　② Background Image （背景图片）：点击 Browse 按钮，可以为网页添加背景图片。　　③ Background （背景颜色）：默认为白色，可以选择其他的颜色。　　④ Text （文字颜色）：在这里将文字设置为黑色。要注意，假如不对背景及文字的颜色进行设置（此时 RGB色值显示为空），那么浏览器在显示页面的时候，就会采用系统的默认设置。但因为不同的系统的设置都可能会有所区别，这样就回导致页面的显示效果也是千差万别。因为，为了更好地让页面体现出你的设计思想，就千万别忘记设定页面的背景颜色及文字颜色。　　⑤ Link （链接颜色）：设定超级链接的颜色，不设定则默认为蓝色。　　⑥ Left 和 Top ：设置左部及顶部的页边距，一般都设置为“ 0” 以方便于网页的编辑。　　确保页面的设置正确后，点击 OK 结束。

设置页面属性

表格详解简明步骤：打开一个页面→插入表格→设置表格宽度现在有好几种尺寸的显示器，“ 14 、 15 、 17 、 19”英寸，网页要在每个显示器上显示正常，就要设置恰当的参数，常用的是在页面中插入表格放内容，采用象素和百分比两种。

使用百分比，可以在各种显示器上有相同的效果，宽度设置为 100％时，在各种显示器上全屏显示。

素大小的表格设置，选择像素为单位，值为 768 。可以在 15英寸显示器上全屏幕显示，在 17英寸显示器上也有好的显示效果。相对使用百分比制作网页，采用像素比较简单。

大多是把表格设置为居中对齐。选中表格，在属性面板选择对齐方式为居中对齐。

完全下载一个表格的内容，才能在 IE 中显示出来。如果页面文件小，可以只有一个表格放内容。如果页面文件很大，可以在页面中，从上到下放几个宽度相同的表格，分别放不同的内容，这样就会一个一个显示表格里面的内容，不用等整个网页的内容下载完。

图像描边：增加图片的美观设置图文混排给图片增加提示：在 IE 中，当指向这个图片时，就会出现

文字提示创建图像地图：当点击一个图像的不同部分，可以链接到

一个新的网页。也可以在当前窗口打开。简明步骤：选中目标图片→选择属性面板中的热点工具→用热工具在图片中画出热点区域→在属性面板中输入链接地址，选择目标窗口打开方式。

设置图像边距：设置图像边距，可以使图像和表格边框产生一个边距，也会和相邻的文字或者其它图片产生一个边距。有时候设置边距为一个非 0 的数值可以起到美观的作用。但是有的时候输入数值为 0 的边距可以使用页面紧凑。

图像详解

超级链接超级链接：指向文档，图象，多媒体文件或可下载软件

的超文本链接选中一个文件。会出现一个文件相对于“文档”，“站

点根目录的选择”。文档相对路径是最适合用于本地链接的路径类型，适合绝大多数Web 站点，推荐使用

根相对路径：如果在一个使用多台服务器的大型 Web 站点或一台服务器上有多个站点的情况下工作，可能需要使用这种类型的路径。很少用到这种路径。如果没有服务器的控制权限，不要使用这种方式！

超级链接

绝对路径：完整的 URL ，称作绝对路径。例如在链接域输入： http://www.xmu.edu.cn

使用锚创建电子邮件链接 : 在属性面板中的链接栏输入 mailto:邮件地址。 mailto:[email protected]

超级链接

创建跳转菜单，例如制作一个友情链接。超级链接

_blank 在新的未命名的浏览器窗口中加载链接文档 _parent 在父框架页或包含该链接的框架窗口中加载

链接文档。如果包含链接的框架不是嵌套的，则链接文档将加载到整个浏览器窗口中。

_self 将链接文档加载到与链接相同的框架或窗口中，该目标是默认值，所以通常您不需要指定它。

_top 将在整个浏览器窗口中加载链接文件，同时移除所有框架。

（ _top 表示整页窗口， _parent 表示父窗口。实际使用中，它们没有任何区别）

超级链接目标窗口： _blank 、 _self 和、 _top 、 _parent 的区别

HTML 简要介绍 HTML （超文本标志语言 HyperText Markup Languag

e ）。为什么叫它“超”文本，也就是说它是文本但又超过一般文本的功能，我们阅读普通的文本（例如电子小说）时，只能从头到尾一页一页的“翻阅”，而当你浏览网页时却可以点击链接从一页跳到另一页而不必把整个页面都看完。这就是“超”文本的真正含义。

HTML 是由标志和属性构成的，它们一起被用来告诉浏览器应该如何显示一页文档。标志用来引用一段文字或是一幅图片等文档部件，属性是标志的选项，在标志中修饰，如颜色，对齐方式，高度和宽度等。很多标志都成对出现，例如有 <TITLE> 就有 </TITLE> 前一个表示开始，后一个表示结束，内容放在两者之间。

HTML 四个重要的标签 <HTML> ---------- 表示该文件为 HTML 文件

<HEAD> ---------- 包含文件的标题，使用的脚本，样式定义等 <TITLE>HELLO WORLD ！ </TITLE> - 包含文件的标题，标题出现在浏览器标题栏中 </HEAD> ----------<HEAD> 的结束标志

<BODY> -------- 放置浏览器中显示信息的所有标志和属性，其中内容在浏览器中显示这是我的第一个网页！ </BODY> ----------<BODY> 的结束标志

</HTML> ----------<HTML> 的结束标志

其它主要标志以下所有标志用在 <BODY></BODY> 中 <A HREF="…"></A> ---------- 链接标志，“…”为链接的文件地址

<IMG SRC="…"> ---------- 显示图片标志，“…”为图片的地址<BR> ---------- 换行标志<P> </P> ---------- 分段标志<B> </B> ---------- 采用黑体字<I> </I> ---------- 采用斜体字<HR> ---------- 水平画线<TABLE></TABLE> ---------- 定义表格， HTML 中重要的标志<TR></TR> ---------- 定义表格的行，用在 <TABLE></TABLE> 中<TD></TD> ---------- 表格单元，用在 <TR></TR> 中<FONT></FONT> ---------- 字体样式标志

常用属性

对齐属性 ALIGN=LEFT 左对齐（缺省值） ALIGN=CENTER 居中 ALIGN=RIGHT 右对齐

范围属性 WIDTH=象素值或百分比对象宽度 HEIGHT=象素值或百分比对象高度

色彩属性　 COLOR=#RRGGBB 前景色　 BGCOLOR=#RRGGBB 背景色

HTML 入门

http://www.gggl.gov.cn/fwgc/jiaocheng/html/3.htm

制作网页的基本要素：

1.要有一定的美术功底、审美观念。要多学会观察，多欣赏一些中外优秀的作品，多欣赏广告作品，这对你的创意都很有启发。2. 作图软件， PhotoShop和 Fireworks都是网页必备的，两者各有长处。3.内容第一，要常更新。个人主页中尽量多写些原创的东西。

如果转载，一定要注明作者。4.要有顽强的毅力，勤于思考；勤于维护，特别是留言簿要常关注。5.时刻为浏览者着想，站在浏览者的立场，多想想浏览者的感受。

谢谢！谢谢！

Documents

DREAMWEVAER MX 2004 入门