下面来介绍一下如何创建一个简单的网页文件。帮助我们简单了解网页的开发。
制作要求:(网页效果)
1、 页面的背景图片为bg0100.jpg;
2、在合适的位置插入图片earth.gif;
3、 在网页中输入横排有阴影的文字
4、将网页用index.htm为名保存在本地站点My site中。
操作步骤:
1、按下面的操作建立站点:先新建一个文件夹My site(下面举例是建立在桌面上的)。 选择“站点”---“新建站点”命令;
在所弹出的对话框中,在“站点名称”文本框中输入“应用实例1”,并点下一步。
按下图选择“否,我不想使用服务器技术”,然后点“下一步”;
按下图选择“编辑我的计算机上的本地副本,…… ”,并选择文件存放的目录路径,然后点“下一步”;
在“您如何连接到服务器?”选项里选择“无”,然后点“下一步”;然后点“完成”。这样就已经建立好一个新的站点了,可以在Dreamweaver界面右边的“文件”窗口里看到新建立的站点信息。
2、在文件夹My site下创建文件夹images,以后此站点中用到的图像文件准备全部存放
在images文件夹里;为方便,这里先把此例中需要用到的图片bg0100.jpg和earth.gif事先存放在此images文件夹里了。
3、创建一个新网页:网页文件--- 新建--- 选“基本页”---创建;
然后在网页编辑器窗口中,选择“修改”-—“页面属性”命令,在“页面属性”对话框中设置各项参数。在“标题”文本框中输入“实例1”
4、用index.htm为名保存文件到本地站点My site中,保存并按F12预览网页。
5、选择“插入”—“布局对象”—“层”命令,或单击工具栏中 “布局”选项卡中的“绘制层”按钮,在工作区合适的位置上插入图片定位用的层Layer1,并将光标定位在层中。
6、“插入”--“图像”命令,或 “常用”选项卡的“图像”按钮,在打开的对话框中选择文件earth.gif插入层中(若跳出“图像标签辅助功能属性”对话框,里面“替换文本”可填写“地球”或其他,或者不填),然后调整层及图像的位置至合适处;保存并按F12预览网页,若图像位置不合适,则调整到合适位置
7、在网页合适位置插入第二个层Layer2,在层中输入文字,并设置文字属性中的字体、大小等,颜色为黑色;然后保存并按F12预览,若文字属性及位置不合适,则调整到合适为止。
8、选中层中的文字,将其复制到剪贴板中;在网页合适位置处插入第三个层Layer3, 并将文字粘贴到层Layer3中,将Layer3中的文字颜色改为白色,并适当调整层Layer3,使两个层中的黑白重叠文字产生阴影效果。然后保存并按F12预览,若效果不满意,则调整到满意为止。