dreamweaver网页制作教案.docx

dreamweaver 网页制作教案 Dreamweaver MX ） 一、 Dreamweaver MX 中文版建站初步 建立一个网站， 首先要在本地机器上做好网站， 再传到网上的虚拟空间上。 现在免费的 网页空间很少了， 在 还可以申请到可以使用几个月的免费空间， 这对于 学习网页制作已经够了。接下来主要介绍本地站点的建立，站点文件命名。 简明步骤： 在 C 盘新建一个文件夹→在 Dreamweaver 中定义站点→新建文件和文件夹→给文 件和文件夹命名。 目标是做一个个人网站。打开“我的电脑”，打开 C 盘，点鼠标右键，选择新建。 选择文件夹选项 盘下会出现一个新建文件夹图标 1 输入你想要的站点名称，这里输入 media, 其实可以任意输入名称的，要注意的是，尽量不要用中文命名，以免出现意想不到的麻烦！ 现在开始在 Dreamweaver MX 中把 media 这个文件夹定义为站点。 打开 Dreamweaver，在菜单栏上，点击站点菜单，选择新建站点 接下来需要给站点起一个名字，可以起任意一个名字。 2 这里起名为 media, 按下一步 按下一步按钮，选择是否使用服务器技术。因为实例建立的是一个静态站点，就选择“否，我不想使用服务器技术”。 3 按下一步按钮， 因为要传到网上的虚拟主页空间， 就要选择 “编辑我的计算机上的本地副本，完成后再传到服务器上”。 按下一步，选择要定义的本地根文件夹 4 这里选择 media 文件夹 点“选择”按钮，因为没有使用远程服务器，就选择“无”。 5 按下一步 按完成按钮，一个站点就定义好了。 6 二、文件命名及修改默认扩展名 站点定义好之后，就要开始新建网页文件和文件夹了，在站点中点击右键，选择新建文件。 给新建的文件输入名称 7 新建文件夹与新建文件类似， 就不重复了。 在文件命名和站点结构方面， 养成良好的习惯很重要。 网站首页默认的文件名，取决于你申请的主页空间，一般是 index.htm,index.html,default.htm 等。同类型的文件，最好放在一个文件夹中，例如把图片文件，都放在 image 文件夹中。不 要把所有文件都放在根目录下， 把一个栏目的所有文件放在一个文件夹中， 在链接网页和维 护时，会很方便。 文件和文件夹的命名， 可以用栏目名称的拼音， 也可以用栏目名称的英文，团队开发时， 有统一的命名规则相当重要。 例如个人简历这个栏目， 命名的文件夹名称可以 是 jianli ，如果命名成英文，可以是 me。论坛这个栏目的命名，大家都是用 bbs 作文件夹名 称。 应该有人发现了， 怎么 Dreamweaver MX 默认扩展名是 .htm，可我的空间默认扩展名是 .html 啊，难道要一个一个改扩展名？有办法的！ 修改 Dreamweaver MX 的一个配置文件， 就可以 把默认扩展名从 .htm 改到 .html。 以 windows2000 操 作 系 统 ， Dreamweaver MX 默 认 安 装 路 径 为 例 ， 找 到 文 件 名 （ MMDocumentTypes.xml ） 这 个 文 件 ， 此 文 件 位 于 ： C:\Program Files\Macromedia\Dreamweaver MX\Configuration\DocumentTypes 文件夹下。 双击 MMDocumentTypes.xml ，在 Dreamweaver MX 中打开 把第三行的 html 移动到 htm,html,shtml,shtm,stm,lasso,xhtml 这部分最前面的位置， 就是改成 html,htm,shtml,shtm,stm,lasso,xhtml 。 8 保存文件。重新打开 Dreamweaver MX ，新建一个文件， 默认扩展名变成 .html 了，其它扩展 名修改方法类似。 三、页面属性的设置 双击 media 站点中的 index.htm ，打开一个空白的页面。我们将从这个空白页面开始制作，了解页面属性的设置和作用。 在工作区点鼠标右键，选择页面属性。 9 打开页面属性对话框 下面是我设置的一个页面属性 在标题上输入 5dmedia，在背景，文本，链接，访问过的链接，活动链接几部分选取颜色。 Dreamweaver MX有强大的颜色选取功能，将在下一篇中详细介绍。设置左边界，顶部边界，边界宽度，边界高度都为 0，可以使页面中的表格与背景没有空隙。 10 如果不设置设置左边界，顶部边界，边界宽度，边界高度，就会与顶部和左边有明显的空隙 在中国大陆， 使用的是简体中文 （ GB2312）编码。繁体网站， 使用的是繁体中文 （ big5 码）。 英文网站使用的是西欧语系（ Latinl ）。 用得