实训一 制作一个简单网页

《实训一 制作一个简单网页》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、实训一创建和管理站点、制作站点首页实训目标：用Dreamweaver制作一个简单的网页一、用Dreamweaver创建和管理站点（一）在D盘上创建“畅想未来”站点在菜单栏中选择“站点”→“新建站点”，在文本框中输入网站的名称“畅想未来”。21212121（二）对站点进行规划1．在文件面板中搭建站点的结构（1）在站点根文件夹下建立4个子文件夹“city”、“novel”、“outspace”和“travel”。在文件面板中右单击站点“畅想未来”，选择“新建文件夹”命令。21（2）在文件夹“city”中建4个子文件夹“images”、“sound”、“

2、swf”和“webpages”。（3）将文件夹“city”中的4个子文件夹分别复制到“novel”、“outspace”和“travel”中。21方法：依次选中“images”、“sound”、“swf”和“webpages”，然后按住Ctrl键，分别将其拖动到“novel”、“outspace”和“travel”中。结果如下图所示。21（二）设置网站首页，重新搭建站点结构1．设置网站首页（1）右单击站点的根文件夹，从弹出的快捷菜单中选择“新建文件”命令。（2）将文件重命名为“index.html”。（3）将其设置成首页。2．重新搭建站点结构（1）

3、将站点的根文件夹下的4个子文件夹“city”、“novel”、“outspace”和“travel”删除。（2）在站点的根文件夹下新建2个子文件夹“images”和“webpages”，如下图所示。在Dreamweaver中打开文件“txt3_1.txt”，并将其另存为index.html。21二、设置index.html网页属性选择“修改”→“页面属性”，打开“页面属性”对话框。（一）设置页面外观在“分类”→“外观”中按下图设置“页面字体”：宋体、“文本颜色”：#034881、“背景颜色”：#B8DCF4。（二）设置页面标题在“分类”→“标题/编

4、码”中按下图设置“标题”：畅想未来。21（三）按F12键，保存并预览网页。三、制作index.html网页（一）编辑文本1．编辑网页中的文本。按下图编辑index.html网页中的文本。换行标记
的使用HTML文件中任何位置只要使用了
标记，当文件显示在浏览器中时，该位置之后的文字将显示于下一行，该
标记就是起到换行的标记。段落标记

的使用由

标记所标识和文字，代表同一个段落的文字。在浏览器中，不同段落文字间除了换行外，有时还会以一行空白加以间隔，以便区别出文字的不同段落，其语法如下：

文字

的有

5、什么区别呢？通俗的讲就是，它们在分行的时候
分得行比

分得行距比较大！在HTML代码中，
是换行符，表示强制性换到下一行。而

则是分段符，相当于回车，等同于两个
。

Copyright?2007-200x畅想工作室，AllRightsReserved

如果您对我们的服务有任何意见或建议，请惠赐E-mail至:teach_ie@163.com

联系电话：0755-12345678联系人：丝雨轻梦

6、>如果您对我们的服务有任何意见或建议，请惠赐E-mail至:teach_ie@163.com
联系电话：0755-12345678联系人：丝雨轻梦2．设置文本格式（1）在第一行前输入2个空格，并去掉最后3行之间的空行，如下图所示。（2）将“未来都市”、“未来旅游”、“未来通讯”、“展望太空”、“科幻小说”设置为“标题2”，并为其添加项目符号。21（3）将“设为首页”、“加入收藏”、“联系我们”、“网站管理”设置为“标题5”。（4）将最后4行文本的对齐方式设置为“居中”。（5）将最后3行文本的颜色设置为灰色（#999999）。3．添加和删除中

7、文字体（1）添加“隶书”、“华文行楷”等中文字体。21（2）将“未来都市”、“未来旅游”、“未来通讯”、“展望太空”、“科幻小说”5行文字的字体设置为华文行楷。（3）按F12，保存并预览网页。21（二）在页面中插入和处理图象1．插入图象（1）在index.html页面顶端插入图象“img3_1.jpg”。（a）将光标置于页面左上角的起始处，然后按回车键，生成一个空行。（b）在菜单栏中选择“插入”→“图象”命令，找到素材文件夹webcoursechapter03images中的图象“img3_1.jpg”。注意：要将其复制到站点的“images”

8、文件夹中。（c）用同样的方法，在第一段下面插入图象“img3_2.jpg”，效果如下图所示。212．调整图象“img3_1