首 页 | 多媒体开发 | 合成 | 平面设计 | 动画制作 | 音频编辑 | 网站建设| 下载中心 | 认证培训
论 坛 | 加入人才库 | 企业展台 | 作品展示 | 项目承接 | 光盘压制 | 配音服务| 虚拟主机 | 新书上市
bryce
 

第二章 初试身手

2.1创建站点

   Dreamweaver为我们准备了一件很有用的工具——Site Manager(站点管理器)。它能完成下面所列的几种工作使建站过程能够比较轻松的完成。

  •  它能将文件在WEB站点与本地硬盘之间来回传递以进行编辑和发布。
  •  它能够让我们在上传主页之前在本地硬盘上编辑一个完整的网站。
  •  它允许多人同时合作编辑一个网站。

  1.现在启动Dreamweaver,菜单中找到命令:Site > New Site(站点>新建站点)弹出Site Definition for (定义站点为)对话框,如图1所示。

2.1.2.gif (10242 bytes)
图1 本地信息

我们可在Local Info项中输入以下相关信息:

  • 在Site Name(站点名称)的输入框中,输入新站点起的名字。
  • 在Local Root Folder(本地站点目录)输入框中,指定这个本地站点文件存放的目录。旁边有一个 图标,点击它可以在电脑中选择目录。也可以直接在输入框中输入(或新建)目录所在的路径。
  • 接下来有个Refresh Local File List Automatically (自动更新本地文件列表)的选项,告诉你是否需要在每次拷贝文件到站点中时,自动地刷新本地文件夹的内容。
  • 最下面的输入项是HTTP Address (HTTP地址)。填入一个域名或者固定的IP就可以了。
  • 最后是 Cache(缓存)的选项,表示是否需要 Dreamweaver产生一个本地缓存来提高站点链接管理时的运行速度。

根据需要也将其它选项设置好了后,点OK就完成了本地站点的设置。

  2.单击种类列表框中的Web Server Info(Web服务器信息),出现服务器信息对话框,在服务器种类列表框中,选择FTP。在FTP主机中,填入你申请的主页存放地的主机的FTP地址、用户名、密码等,如图2所示。

2.1.3.gif (9995 bytes)
图2 服务器信息

  3.单击确定按钮,这是会弹出一个对话框,询问你是否使用缓冲区来加快网页的读取速度,可根据自己的喜好选择是或否,最后则会弹出一个如图3所示的对话框,单击Done(完成)就完成了建站工作。

2.1.4.gif (5362 bytes)
图3定义站点

  现在我们就在硬盘中建好没有任何内容的站点,下面我们将为站点添在。

2.2 在网站中加入网页

2.2.1 新建网页
  我们可以在站点管理器中先加入一个空文件或空文件夹,而不对它进行编辑。在本地文件夹中单击鼠标右键,弹出如图4所示的菜单,选择New File(新建文件)选项。 


图4 新建文件

 将文件命名为index.htm或index.html(请参照网管的要求命名),这是网站的主文件,即首页。输入网址后将自动打开这页,然后再通过超级链接访问其他页面 。

2.2.2编辑页面:下面我们就可以编辑这个页面了,双击index.htm这个文件,进入编辑页面,如图5所示。


图5 编辑新文件

  1.设置网页属性
  这是设计网页的第一步,一个网页有许多属性,如标题、背景颜色等。你可以选择Modify>Page properties(修改>页面属性),弹出页面属性对话框,如图6所示。


图6 页面属性

  • 改变页面标题 (Title)
      在标提栏(Title)中可以填入你首页的标题,它是显示在浏览器的最上面的一行文字,是这个网页的简要概括。
  • 添加背景图像
      在默认状态下,背景一般为白色或灰色,可以用下面两种方法来改变页面的背景。
      (1)在Backgroubd Image(背景图片)对话框中,点击Browse(浏览)按钮或直接输入背景图片存放的位置。
      (2)在Background(背景)中选择一种颜色作为网页的背景。
    第一种方法所选择的背景是图案,可能会有更好的视觉效果,但会降低速度。对于所选择的图案,如果不是在当前网站的目录中,则Dreamweaver会自动将其拷入到网站目录中。
  • 其他选项可先保留原设置。

  2.在网页种添加文本
  
在Dreamweaver中加入文字很简单,通过键盘输入,也可从粘贴。
设定文本属性
  通过菜单Window>Properties(窗口>属性)打开文本属性窗口如果你的编辑器中没有属性窗口,那么请单击窗口菜单,选择其中的属性选项。

  • 把正文变成标题
    用鼠标指针单击并拖动高亮需作标题的文字, 然后,单击Format(格式)下拉列表中的下箭头,选择heading 1(最大的标题), 效果如图7所示。


图7定义标题

  • 改变字体
      通过字体列表框,可以改变英文的字体。如果我们是第一次打开软件时会发现没有中文字体,下面就来加入我们所需的字体。
    • 单击Font(字体)下拉列表,选择最后一项Edit Font List...
    • 在字体列表对话框里找到所需的字体,然后双击或点这样字体就增加进来了,如图8所示。
  •  


    图8 增加字体

注:在给网页设定字体时,要考虑大多数访问者的电脑中是否存在这种字体,如果没有则会用默认的宋体替代,所以我们一般可选Windowa中都预装的宋体、楷体等。

  • 改变字体颜色
      选中要改变颜色的字体,单击文本颜色对话框,从中选择所需的颜色即可。
  • 创建超级链接
      我们浏览页面时,会发现有一些文字或者图形甚至一图形中的某一部分,会让鼠标指针变成一只手的形状,点击鼠标后页面会被其它的页面代替或者链到其它类型的文件,这些就是我们平时所说的“超级链接”,超级链接即可链结同一站点的文件,也可指向遥远目标。创建超级链接有两种类型,一是绝对路径,也就是我们所说的网址,如先选中需链链接的文字或图像,然后在Link(链接)对话框中输入该链接的地址
    另一是相对相对路径,一般用于内部链接。建立这类链结两种常用的方法。
    1. ,然后从出现的对话框中选所要链接的件。
    2. 将当前窗口缩小,点站点管理器,在属性面板上单击并拖动,这时可看到一个箭头,将其指向站点管理器中我们所要链接的文件,然后松开即可,如图9所示。
  •  


图9链结目标页面

  • 添加定位点
      定位点与超级链接差不多,只不过超级链接是指向其所在页面以外的地址的,而定位点(就是通常说的书签)一般是指向其所在页面的内部。这种链接创建的方法和前面介绍的一样,只是需要预先定义好锚点(书签)。先将要作成锚点的文本或图形选中,选择菜单命令中的Insert > Named Anchor(插入>锚点),或从对象面版(见图10)中的Ivisible项中选,在弹出的窗口中填好锚点名称。定义的文本或者图形旁边就会多出一个图标,然后点属性面板Link项右侧的小箭头,就可找到刚才命名的锚点,另外还可用拖动指向的方式建立页内链结。


图10插入锚点对象

  3.加入图像

  在Dreamweaver中插入图像是非常容易的。我们在页面需插入图像的位置点一下,然后按img.gif (302 bytes),在弹出的Select Image Source(选择图像源文件)对话框中,先选择要插入图像的存放路径,再选所需的文件,图象就插入到光标所在的位置。

  如果所选择的图像文件不在当前站点内,Dreamweaver会询问是否将该图像文件拷入到站点内,选择是。单击图像会出现图像属性对话框,使用方法与文字属性面板相似,如图11所示。


图11 图像属性面板

图片链接的建立也是同样的步骤,选定目标文件即可。所不同的是:如果要为图片建立热区,可以利用图片属性条中的几个几何区域选择按钮来划分图形,其中是建立矩形热区,为圆形,为不规则形状,然后分别指定所要链接的文件。
 

2.3 通过站点窗口工作

    点击Dreamweaver面板上的图标,就可以将Dreamweaver的站点管理窗口打开,在站点窗口中可以同时看到远程服务器上的站点文件情况和本地站点的当前状态。如图12所示: 

 
图12 站点窗口

    窗口中两个主要的区域分别显示的是服务器上和本地的站点,现在左边区域我们将它设置为站点地图方式显示。右侧区域中显示的是本地站点的目录结构,显示了站点所在目录中的所有文件,对这些文件的操作方式与我们在Windows的资源管理器里的使用方式大致相同,可以增加、删除、修改站点中的文件,不过还有很多Dreamweaver与站点有关的其它命令,只要点击鼠标的右键,就可以在弹出的浮动窗口中选择命令。双击页面图标将开启一个新的文档编辑窗口载入该页,进入页面编辑状态,而站点窗口不会有改变。
    站点管理窗口中的操作项比文档窗口的要少,只在窗体上部。表示将站点文件按列表方式显示,则表示以站点地图方式显示站点文件之间的关系。旁边的下拉菜单显示当前编辑的站点名称,随时可以在列表中选择其它站点进行编辑。有一个小灯的按钮则显示了与服务器的连接状态,绿灯表示连接成功,表示将选中文件下载到本地,则表示将选中文件上传到服务器。点击     就可以对站点进行手动刷新。

 到此为止,我们已经了解了创建一个简单的网页的全过程,至于更详细的内容,请参见以后的各章节。