Dreamweaver网页制作技巧:使用模板
日期:2006年12月18日 作者: 查看:[大字体 中字体 小字体]-
随着Internet的普及,很多人已经不满足于仅仅上网冲浪,而希望深入地参与其中。现在,拥有自己的Web网站已经成为一种潮流。虽然制作一个简单的网页并不困难,但是制作出超凡脱俗的网站就不那么容易了,因此我们特意为大家准备了最新网站设计软件Dreamweaver MX 2004的系列教程,希望对大家有所帮助。
通常在一个网站中会有几十甚至几百个风格基本相似的页面,如果每次都重新设定网
页结构以及相同栏目下的导航条、各类图标就显得非常麻烦,不过我们可以借助Dreamweaver MX 2004的模板功能来简化操作。其实模板的功能就是把网页布局和内容分离,在布局设计好之后将其存储为模板,这样相同布局的页面可以通过模板创建,因此能够极大提高工作效率。
一、制作模板
制作模板和制作一个普通的页面完全相同,只是不需要把页面的所有部分都制作完成,仅仅需要制作出导航条、标题栏等各个页面的公有部分,而把中间区域用页面的具体内容来填充。

第一步:先在Dreamweaver MX 2004中运行“File→New”命令,接着从图1所示的窗口中依次选定“Template page→HTML template”选项,点击“Create”按钮之后即可创建一个模板文件。
第二步:在页面设计视图下插入网页框架、导航条、Flash标题等所有页面公有的元素(图2),然后运行“File→Save”命令将这个模板保存下来。

小提示:可以先下载一个中意的网页,然后在Dreamweaver MX 2004中打开它,仅仅保留框架等元素之后通过“File→Save as Template”命令将其保存为模板,这样能够省去很多制作模板的时间。
为了避免编辑时候误操作而导致模板中的元素变化,模板中的内容默认为不可编辑,只有把某个区域或者某段文本设置为可编辑状态之后,在由该模板创建的文档中才可以改变这个区域。先用鼠标选取某个区域(也就是每个页面不同内容的区域),接着运行“Modify→Templates→New Editable Region”命令,并且在弹出的对话框中为这个区域设定一个名称,这样就完成了编辑区域的设置。
小提示:设定好编辑区域之后需要运行“File→Save”命令保存所做的修改。
二、使用模板
有了模板之后,接下来就要在编辑网页时候使用它们了。只要在Dreamweaver MX 2004主窗口中运行“File→New”命令即可看见图1所示的新建窗口,接着进入“Templates”标签即可查看到已经保存的模板,从中选取一种还可以在右部的预览区进行预览(图3),最后挑选一款中意的模板并点击下部“Create”按钮打开这个模板。

在打开的模板中,无法编辑的区域将呈高亮状态显示,但是有些位置是锁定区域,却不是高亮显示,这主要是因为图片正好盖住了背景的颜色。对于这种情况,可以运行“Edit→Preferences”命令,在弹出窗口的“Category”列表中选取“Highlighting”一项,接着在右部区域中选取“Locked regions”旁边的“Show”选项(图4),并且设定高亮显示色为蓝色,这样就可以很清楚地分辨出模板中的锁定区域了。
小提示:如果仍然看不见高亮显示效果,还可以依次选中“View→Visual Aids→Invisible Elements”命令。
- [1] [2] 下一页
-
- Dreamweaver网页制作技巧:使用模板 相关文章:
- ·Web2.0在中国步入歧途 缺赢利模式VC有错
- ·Flash与Photoshop合作制作模糊渐变动画
- ·CSS模块化设计——从空格谈起
- ·用AutoCAD五分钟内完成三维足球建模
- ·完全防御DDoS攻击的实时监测模型
- ·3DsMAX三维建模U盘造型
- ·BPEL模型基础
- ·AutoCAD滚珠轴承建模全过程
- ·Javascript的一种模块模式
- ·进入Cisco路由器配置模式
- Dreamweaver网页制作技巧:使用模板 相关软件
- ·公司企业网站管理系统模板功能强大版
- ·服装专卖店网站模板免费版
- ·NDS《旋转滚球》模拟器
- ·行会2之维京霸主-模拟方式免CD补丁
- ·医院大亨-模拟方式免CD补丁
- ·NDS《神奇四侠2 银影侠》模拟器
- ·NDS模拟器NO$GBA 2.4b
- ·CPS3街机模拟器
- ·NDS《新彩虹岛中文汉化版》模拟器
- ·CPS3《红色地球》模拟器
- 特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作
- 者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转
- 载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源:http://www.hackhome.com
精品推荐
热点TOP10
- ·入门:用Dreamweaver简单描述制作网页的基本步骤
- ·Dreamweaver+ASP制作动态二级菜单
- ·用Dreamweaver MX 2004制作ASP动态网站(投票系统篇)
- ·公司建站完全手册――网页色彩设计点滴
- ·Dreamweaver CS3 新功能描述
- ·Dreamweaver实例:随机播放背景音乐
- ·Dreamweaver插入Flash添加透明或其他参数
- ·充分利用Dreamweaver CS3的代码片断功能面板
- ·Dreamweaver也能轻松制作Flash相册
- ·简单描述Adobe Dreamweaver CS3 的最新功能
- ·用DW制作网页时关于文字自动换行的小技巧
- ·在DreamweaverCS3中用Spry将XML数据显示到HTML页
- ·Dreamweaver教程:框架技术
- ·级联删除的触发器代码解释
- ·Dreamweaver 8.0/Flash 8.0/Fireworks 8.0简体中文正式版下载及注册码
- ·网页制作傻瓜工具集锦
- ·Dreamweaver MX 2004的PPT格式课件
- ·Dreamweaver使用CSS样式表设置网页
- ·用DW8轻松制作漂亮的Flash像册
- ·Dreamweaver使用CSS样式表设置网页文本格式
特别推荐
- ·利用DW8掌握网页代码基本格式
- ·用Dreamweaver8制作网页中常用的过度效果
- ·级联删除的触发器代码解释
- ·DW滤镜样式的语法规则
- ·Dreamweaver初学者常见问题解答
- ·12个Dreamweaver鲜为人知的小秘诀
- ·巧妙运用Dreamweaver进行网页制作技巧
- ·网页导航设计九大注意事项
- ·Dreamweaver技巧12条
- ·DreamWeaver 经典
- ·寻找Dreamweaver鲜为人知的小秘诀
- ·在DW中插入Flash的参数详解
- ·Dreamweaver层使用八定律
- ·用Dreamweaver MX 2004的Flash动画元素
- ·DW 技巧简单几问几答
- ·Dreamweaver MX实例:插入交替图像按钮
- ·在DreamWeaver中应用CSS样式表技巧两则
- ·Dreamweaver MX 2004的一句话技巧
- ·巧妙运用DW进行网页制作技巧
- ·Dreamweaver经典问题大搜罗
