1.8　应用案例

在Dreamweaver中规划和建立一个名为“Tourism”的本地站点，并建立一个网页文件news.html，浏览效果如图1-20所示。

图1-20　页面浏览效果

1.规划站点结构

拟规划“精品推荐”“旅游快讯”“特色线路”“特色景点”“特色美食”5个栏目，建立文件夹pages存放这5个栏目的页面，每个栏目独立建立一个子文件夹。建立文件夹images存入图片素材，其他素材根据需求建立相应的文件夹。网页文件index.html在站点的根文件夹下。站点目录结构如图1-21所示。

2.在Dreamweaver中建立站点

按照1.7.2小节的介绍，在Dreamweaver中创建本地站点，创建完成后的站点结构如图1-21所示。

3.在Dreamweaver中建立网页文件news.html

本案例在Dreamweaver的设计视图下完成。

①在Dreamweaver的设计视图下，修改标题文本框中的文字为“花花旅游在线”。

②插入图片，并适当调整图片的大小。图片文件存放在站点根目录下面的images文件夹中。

③输入文字“旅游快讯”，并在“属性”面板中设置格式为“标题3”。

④输入文字。

图1-21　站点结构

⑤保存后在浏览器中预览。

本案例在Dreamweaver的设计视图下完成，网页上元素的格式控制还没有很好地实现。例如，没有设置文字、图片元素居中，没有设置文字的字间距和行间距，文字的首行缩进没有实现。这些内容，需要学习后面章节中的HTML和CSS之后再来完成。