6.代码设置

下拉菜单的制作，其效果可直接在网上下载。将下载下来的源代码放到DW代码编辑页面中，调整CSS，将文字替换为自己所需的内容。如图5-48、图5-49所示，直接将“魅力展示”与“经典产品”换成“小城概况”和“小城文化”即可。图5-50是巫溪文化导航条的全部代码。最终效果如图5-51至图5-53所示。

图5-48

图5-49

图5-50

(https://www.daowen.com)

图5-51

图5-52

图5-53

小贴士

一定要先保存网页，再制作页面。因为新建页面未保存前，网页的缓存地址一般都不在所要制作的网站文件夹内，这样会造成链接路径错误。先保存页面，可以确保该页面和图片文件都在同一个网站文件夹的路径内，如页面文件“ywh.html”在切片文件夹内，图片文件也在切片文件夹路径的“image”文件夹内，就不会出现因图片链接错误而无法显示等问题。在制作过程中，想要查看制作效果，可按F12键和“编辑页面”图标来实现。

按照上述步骤，一个具有简单交互功能的页面就设计完成了。所有页面都可按照这样的方式实现网页基本功能的转换，并将需要实现跳转的元素分别链接到合适的地址，从而实现页面与页面之间的链接。