使用Dreamweaver CS3文件库功能快速更新网站

2016-02-20 01:12 7 1 收藏

今天天气好晴朗处处好风光,好天气好开始,图老师又来和大家分享啦。下面给大家推荐使用Dreamweaver CS3文件库功能快速更新网站,希望大家看完后也有个好心情,快快行动吧!

【 tulaoshi.com - Web开发 】

往往我们在建立一个较为大型的网站的时候会有很多的副页面框架模式甚至一些小的细节元素都是相同的,但是令人困扰的是在更新它们时却要费些周折,要一遍遍的反复更新每一个页面中的元素。现在我们可以对那个时代说再见了,因为DW引入了"库"这个概念。我们可以利用它来批量的更新网站中相同的元素。大至整个页面框架,小至一个字符! 库的引入在DW3中还不很完善,但在DW4以近完美。下面就让我们来看一下如何利用库来更新站点:


一、库文件的建立
建立库文件有两种方法,一是在编辑状态下选定一个元素,然后打开库面板(F11键-在弹开的Assets中选择图标为翻开的书本样的标识)按下。那么DW就会自动的建立一个后缀名为".LIB"的文件将该元素读到这个文件当中,同时会在本地站点中建立一个"Library"文件夹。它代表了每一个库文件都是独立的,当我们上传本地站点到远程服务器中时,要将该文件一并上传;第二种方法是打开库面板,在白色的文件记录区域点击右键,选择弹开的列表中的New Library Item(新的库项目),建立一个空白的库文件,然后双击打开进行编辑。第一种方法适用于文本\图像\链接等小元素的库文件建立。第二种方法适用于大规模的整篇幅的库文件的建立,绝大多数情况下,大规模库文件的建立都是和模板配合使用的。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)


二、库文件的应用与编辑
我们建立了一些简单的库文件,其中包括连接\图像\表格。它们每一个都可以被理解为一个单一的元素插入到编辑区使用,只要从库面板中直接拖拽它们到需要的地方就可以了。需要注重的是,插入的库文件是锁定状态的。它们的显示方式是淡黄色的。选定一个库文件查看代码,你会发现如下的标签"***"这代表了一个完整的库文件,有开始有结束。你可以更改标签的位置,但不要删除它们,那样的话该库文件就被破坏而返回到纯编辑状态。
编辑库文件的方法有两种,一是在库面板文件记录区中双击某个库文件进入编辑状态。二是选定一个库文件点击右键在弹开的列表中选择Open Library Item(打开库项目)进入编辑状态。当我们编辑完成并保存库文件后,处于编辑状态下的正在使用该文件的页面会自动更新。假如有其他的非编辑状态的页面也使用了该库文件,那么DW会自动的弹出一个提示框。

 


询问是否同步更新本地站点内所有使用该文件的页面。这个功能也就是库文件的最大优点。我们制作完成站点以后将所有文件连同库文件夹一并上传到远程服务器中,那么当我们在连接远程站点的状态下更改某个库文件时,同样的会得到DW的提示。


询问是否同步更新全部站点中使用了该库文件的所有页面。点击ok键,远程站点中的文件便得到了更新,完全不需要一点点的反复更新每一个文件。


到这里为止,我们对库的使用以有了一个大概的了解。至于该功能的熟练使用就要靠自己多动手了。相信该功能会给您站点更新带来极大的方便。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

来源:http://www.tulaoshi.com/n/20160220/1633481.html

延伸阅读
标签: Web开发
      Dreamweaver CS3使用临时文件将一些未经保存的数据传输至其它应用程序中,例如用户可以在其它浏览器中预览Dreamweaver CS3正在编辑的软件。       许多应用程序都会使用到临时文件,一般这些临时文件的作用是应用程序的临时工作空间,或者用于自动存储等功能,而Dreamwea...
标签: Web开发
A. 插入栏 B. 文档工具栏 C. 文档窗口 D. 面板组 E. 标签选择器  F. 属性检查器 G. 文件面板 A. 显示代码视图 B. 显示代码视图和设计视图 C. 显示设计视图 D. 文档标题 E. 文件管理 F. 在浏览器中预览/调试 G. 刷新设计视图 H. 视图选项 I. 可视化助理 J. 验证标记 K. 检查浏览器兼容性 A. 标签选择器 B. 选取工具 C. 手形工具...
标签: Web开发
iframe框架,虽然在浏览器兼容性上谈不上非常友好,但它的应用的确广泛。我们可以将它嵌在网页中的任意部分,这样对于提高网页排版的灵活性还是非常有好处。当然,iframe相关代码的书写还是令许多人头痛的,今天我们就通过 Dreamweaver的标签选择器来插入一个iframe框架,不需要你手工写一句代码的方法。 启动Dreamweaver CS3点击菜单插入&rar...
标签: Web开发
Dreamweaver CS3相对于之前的版本,对于CSS的编写更加规范化了,下面我们来了解一下它的CSS布局规则。 CSS文件的链接方式 ·导入CSS:常用应用多个CSS文件时,将多个CSS导入一个CSS文件中 CSS规则定义有三种: 1)类比如“.RedText”、“.BlueText”和“.BigText”等等 2)标签针对原有HTML标签做的重新CSS定义...
标签: Web开发
CSS文件的链接方式 1、附加链接:外部CSS文件 2、导入CSS:常用应用多个CSS文件时,将多个CSS导入一个CSS文件中 CSS规则定义有三种 1、类比如“.RedText”、“.BlueText”和“.BigText”等等 2、标签针对原有HTML标签做的重新CSS定义 3、高级伪类、定义了ID的元素,以及综合性定义 CSS规则的应用 ...

经验教程

154

收藏

18
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部