当前位置:主页 > 平面设计

最新发布

网站更新短平快
网站更新短平快

我们在建立一个大型网站的时候,往往会包括很多相同的页面框架模式,甚至一些细节元素都是相同的。但令人困扰的是,在更新它们时颇需要费些周折,要反复更新每一幅页面中的元素。不过现在我们可以对这种陈旧的工作方式说再见了,因为DW引入了“库”这个概念,我们可以利用它来批量地更新网站中相同的元素,大至整个页面框架,小至一个字符。  库的引入在DW3中还不很完善,但在DW4中已经十分完美了。下面就让我们来看一下如何利用库来更新站点:  一、库文件的建立  建立库文件有两种方法:  1. 在编辑状态下选定一个元素,然后打开库面板(按下F11键,然后在弹开的Assets面板中选择图标为翻开的书本模样的标识),按下。DW会自动建立一个后缀名为“.LIB”的文件,将该元素读到这个文件中,同时会在本地站点中建立一个“Library”文件夹。这说明了每一个库文件都是独立的,当我们上传本地站点到远程服务器中时,要将该文件一并上传。  2. 打开库面板,在白色的文件记录区域点击右键,选择弹开的列表中的New Library Item(新的库项目),建立一个空白的库文件,然后双击打开进行编辑。第一种方法适用于文本\图像\链接等小元素的库文件建立;第二种方法适用于大规模的整篇幅地建立库文件。绝大多数情况下,大规模地建立库文件都是和模板一起配合使用的。  二、库文件的应用与编辑  首先,我们建立了一些简单的库文件,其中包括链接(Link1)、图像(Image1)和表格(Table1),它们每一个都可以被理解为一个单一的元素。要插入到编辑区使用,只需从库面板中直接拖拽它们到需要的地方就可以了。注意:插入的库文件为锁定状态。它们的显示方式是淡黄色。选定一个库文件查看代码,你会发现标签“<!-- #BeginLibraryItem "/Library/image1.lbi" -->***<!-- #EndLibraryItem -->”代表了一个完整的库文件。你可以更改标签的位置,但不要删除它们,否则该库文件就被破坏而返回到纯编辑状态。  编辑库文件的方法有两种:  1. 在库面板文件记录区中双击某个库文件进入编辑状态。  2. 选定一个库文件,点击右键在弹开的列表中选择Open Library Item(打开库项目)进入编辑状态。  当我们编辑完成并保存库文件后,正在使用该文件的编辑状态的页面会自动更新。如果有其他的非编辑状态的页面也使用了该库文件,那么DW会自动弹出一个提示框,询问是否同步更新本地站点内所有使用该文件的页面。这个功能是使用库文件的最大优点。我们制作完成站点以后将所有文件连同库文件夹一并上传到远程服务器中,当我们在连接远程站点的状态下更改某个库文件时,同样的会得到DW的提示,询问是否同步更新全部站点中使用了该库文件的所有页面。点击“OK”,远程站点中的文件便得到了更新,完全不需要一点一点地反复更新每一个文件。  到这里为止,我们对库的使用已有了一个大概的了解。至于该功能的熟练使用就要靠自己多动手了,相信该功能会给大家的站点更新工作带来极大的方便。

2 次浏览
轻松解决DW4的问题
轻松解决DW4的问题

DW4(Dreamweaver 4)的到来又让搞网页设计的朋友兴奋了一阵。对普通设计人员而言,在多项新增功能中,有两种设计工具最值得称道:一是全新的版面规划功能,二是Flash文本与按钮制作工具。前者提供了两种视窗模式,普通型与版面型。当你切换入版面型时就可以用其上的工具非常便利地进行整个版面的规划了,犹如使用普通的排版软件一样,方便快捷。后者增强了与Flash的交互,操作简单,功能非常便利,尤其实用于不懂Flash的初中级用户。  但是,欣喜之后,我们痛苦地发现:DW4并非那么完美!说是它的Bug也好,还是软件对本地化开发的重视程度不够也好,总之要用好它,还必须要解决这些小毛病才行。下面就把DW4中常见的几个“小麻烦”罗列出来,并尽量提供一些较完美的解决之道。  一、字体设定不能保存的问题  DW4里面的字体、文字大小设定(Edit-Preferences-Font/Encoding)不能保存,怎么解决?没办法,只有修改注册表,不过很简单。具体方法如下:   退出运行中的DW4,先备份好注册表。  建立一个纯文本文件,其内容如下:   REGEDIT4   [HKEY_CURRENT_USER\Software\Macromedia\Dreamweaver 4\Font Preferences]"Number Encodings"=dWord:0000000c "Default Encoding"=dword:00000005   保存成为一个后缀是.reg的文件,然后执行这个.reg文件,修改就会自动完成。  二、普通文本的汉字输入问题  这是DW4的一个大问题。即使把coding 设成 gb, 中文输入时,用中文字体,也不能解决。在使用之中,全拼输入,紫光拼音等比较正常,但用五笔输入法等输入法时却要出问题:无论你打多少字,它都会用后一个字覆盖前一个字,让你的页面始终只有一个字。另一种情况是,在某些光标位置可以输入,有些光标位置又不行。对这个问题,现在没有很完美的解决办法。笔者推荐试一下以下方法:  1.更换另一种输入法,即建议采用全拼输入,紫光拼音、拼音加加等输入法,不要采用常用五笔输入法。  2.直接将中文文本信息拷贝进去。  3.有时可输入,有时不可输入的情况,请点击一下DW4的标题和属性栏就可以输入了。  4.系统采用中文的Windows或Windows ME。  三、空格输入问题   不能输入空格。这是DW3就有的老问题了。这里提供更完美的三种解决办法。  1.输入全角空格。如果你用的是智能ABC的拼音输入的话,那请按SHIFT+空格,这时输入法的属性栏上的半月形就变成了圆形了,然后再敲空格键,空格就出来了。  2.你也可以在输入的时候直接按CTRL+SHIFT+空格,连按4次,就可以得到两个汉字大小的空格。  3.将属性栏中的FORMAT设定为Preformatted后,就可直接输入空格。  四、表格的亮暗边问题  原来的DW3可以做表格的阴影效果,可是DW4就不行了,因为属性板上没有了borderlight和borderdark的输入框。  可以用以下三种方法来变通解决:  1.已经有人制作出了第三方的extension,你可以到http://www.paladinland.com/dreamweaver/tablebordercolor.zip下载,把解压文件直接放入Dreamweaver4/Configuration/Objects/common/就可以了。打开Dreamweaver4,把Object面板拉拉长,就可看见增加了新的表格对象插入选项。  2.内外边框的颜色可以用鼠标来选择。从表格的上方或者左方选择表格,鼠标会变成一个向下或向左的箭头形状,这时你就可以选中表格单元的内边框了。这是再设定属性栏中“Border” 的颜色即可。这样可以设定表格单元的内边框为不同颜色了。把cellspace设的大一点,效果更明显。  3.当然,如果你有水平,可以直接编辑源代码解决。  五、Flash 文字和按钮的汉字输入问题  DW4中加强了与Flash的直接交互,比如直接制作Flash 的文字和按钮、直接浏览插入的Flash文件(按属性栏中的三角形播放键)等等。就算你不会使用 Flash 也可以在 Dreamweaver 中直接插入 Flash 动画格式的文字或按钮,只要简简单单输入文字就可以了。比起传统的点阵图文字或按钮,档案更小、更漂亮。但是,遗憾的是,其中输入的文字不支持中文!更无奈的是,到目前为止,笔者也不能提供一个哪怕是稍微可用的解决办法!有人曾提供安装日文字体的方案,太麻烦,而且只能输入部分中文。还是老老实实地输英文吧。  其实我认为最彻底的办法,还是直接用Flash软件制作,况且在Flash5中作一个类似DW4中的中文按钮并不难。如果你不会,还是学一下吧,保证一定不会后悔的。  虽然DW4有上述的一些“小麻烦”(特别中文支持方面),但是总的说来,疵不掩瑕,DW4仍是目前最好的网页制作软件之一。有理由相信,在不久的将来,DW4所有的问题都会得到完美解决的。

3 次浏览
Dreamweaver MX 2004从零开始(7)
Dreamweaver MX 2004从零开始(7)

前面已经介绍了关于Dreamweaver MX 2004的基本操作方法,灵活运用这些方法就可以组建出一个精美的网站了。完成了这些操作之后,我们在网上安家的历程可以说已经走了一大半,剩下的就是将网页上传到站点以及页面的后期维护更新操作了。其实这些任务并不复杂,只要我们通过Dreamweaver MX 2004内置的站点管理功能就可以很轻松地实现!  定制站点  首先我们要在Internet上找到一些用于存放主页的空间,之后我们就可以在Dreamweaver MX 2004中对这个站点进行一番定制。  第一步 运行“Site→Manage Sites”命令,并且在弹出窗口中点击“New→Site”按钮新建一个站点。  第二步 在站点设置窗口左部选取“Local Info”一项,接着在右部区域中分别输入站点的名称、本地存放文件的路径等信息。  第三步 进制在窗口左部选取“Remote Info”一项,接着在右部区域中输入申请空间的时候得到的远程FTP站点传输类型(一般为FTP)、远程服务器存放文件路径、主机地址、用户名和口令等信息。同时还要根据站点的传输模式来选择是否采用“Use passive FTP”一项,这是因为部分FTP站点采用被动工作模式,对于这部分站点就要选取该项(如图1)。

8 次浏览
DREAMWEAVER 技巧(上)
DREAMWEAVER 技巧(上)

1)怎样将 Dreamweaver 集成到 IE 浏览器?  Dreamweaver 安装程序会在上下文选单增加一个“ Edit with Dreamweaver ”命令,我们还可以修改 Windows 的注册表使它与 IE 集成。就象 MS Word 、 Frontpage 和 Notepad 一样,通过 IE 工具栏的编辑按钮来调用 Dreamweaver 打开当前网页。  将下面文本的最后一行要改为你自己的 Dreamweaver 安装路径,把它们保存为一个 *.reg 文件,双击它将信息添加到注册表即可。REGEDIT4[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit\command]@="\"D:\\Macromedia\\Dreamweaver 3\\dreamweaver.exe\" \"%1\""  如果要设置为 IE 缺省的编辑器,打开 IE 的“Internet 选项”,在程序标签指定。

3 次浏览
用Dreamweaver MX实现网站批量更新
用Dreamweaver MX实现网站批量更新

在Dreamweaver 4.0中,我们就已接触了模板与库的概念,知道它们是批量生成风格类似的网页的好工具。如今在Dreamweaver MX(以下简称DW MX)中,模板与库的功能得到了进一步细化与加强,尤其是实现关联网页自动更新的特点,使得模板与库成为DW MX的一大亮色。  1、首先我们来看看模板的应用,与Dreamweaver 4.0不同的是,DW MX把模板的操作拓 展到了“Modify”与“Insert”两个菜单下,同时,在“File”选项的“Assert”子选项中也可以直接创建模板。图1  2、找到“Assert”子选项,在左边的工具栏中单击“Templates”按钮,此时的模板为空,我们可以在右下角单击“New Template”按钮,一个空白的模板就会出现在面板中(如图1),点击模板名称,是模板进入可编辑状态,注意,此时的模板还没有任何添加任何元素,我们可以像编辑普通网页一样在模板上添加表格、图像、文字等。添加完后,保存模板,可以在默认站点文件夹的“Templates”子文件夹下找到刚才做好的模板,扩展名为.dwt。  如果嫌这样麻烦,DW MX还提供了一种更直接的方法,编辑好要保存为模板的网页后,在“File”菜单中点击“Save as Templates”,即可生成模板。  3、模板生成之后,还要建立可编辑区域,为将来填入不同的网页内容做准备,打开模板,单击菜单“Insert/Template Object/Editable Region”,出现可编辑区域对话框,指定区域名称后,可以看到模板中出现了蓝色的方框。保存后就建立了可编辑区的模板。  4、如何批量生成网页呢?单击菜单“File/New”,选择“Templates”选项,马上就可以看到建立生成的模板,单击“Create”按钮,模板就开始自动套用在网页上。这个时候我们可以看到,原来的模板区域是黄色,其中的元素已经固定,不能编辑,而我们刚刚指定的可编辑区域是蓝色,可以编辑。这样一来,不但大大简化了我们生成相似网页的工作量,而且有效地保证了网页风格的一致性。  5、最后,就是关联网页批量更新,这是大型网站更新网页时必不可少的一项技术,在DW MX中可以轻易实现。因为我们所有的网页都套用了相同的模板,而且这些网页都被保存在同一个站点目录下,当我们要对所有网页的公共元素进行改动时,只需修改模板中的元素即可。图2

2 次浏览
Dreamweaver主页制作技巧四则
Dreamweaver主页制作技巧四则

1、Dreamweaver中的复制  我在网页中复制的文字,粘贴到Dreamweaver中时,它总是带有原来网页的格式,请问如何只复制其中的文本文字呢?  答:在Dreamweaver中复制和粘贴文本有两种,一是标准的方式,也就是你使用的那种 方式;另一种就是仅复制粘贴文本,它忽视了HTML格式,只复制文本,方法是在复制和粘贴时多按一个“Shift”键。  2、如何制作替换图片的链接  有的网页图片链接很特别,鼠标放上去时它就会发生变化,变成另外的图片,请问如何制作?  答:这个就是替换图片链接,没有单击时是一 张图片,当把鼠标移动到图片上的时候变成了另一张图片,利用Dreamweaver能方便地制作这种替换链接。预备两张大小一样的图片,先在网页上放一张图片,然后在“图片属性”对话框中的Link中设置图片指向的链接,按“F8”键开启“Behaviors”对话框,单击“+”号,选择“Swap Image”开启“Swap Image”设置视窗,点选“Browse”设置需要替换的图片,单击“OK”。  3、如何设置页面的访问口令  在设计网站时,有的页面不能让所有人都浏览,我想在该页设置访问密码,请问任何制作?  答:在部分加入:  < script language="JavaScript">< /script>  说明:其中“mima”是正确的密码,“1.htm”是当输入正确密码后链接的页面。这种方法不太安全,浏览者只要查看了页面源代码就能知道设置的密码。最好还是使用ASP、PUP等实现比较好。  4、Dreamweaver插件的安装  我在网上下载了许多Dreamweaver插件,如何使用它们呢?  答:Dreamweaver 3以上版本都具有插件管理器Extension Manager,它可以实现插件的全自动管理,你可以到www.macromedia.com/下载得到。安装后,就可以从Dreamweaver中启动管理器。具体方法是选择“Command/Manage Extensions……”命令启动管理器。

10 次浏览
Dreamweaver里使用层的一些建议
Dreamweaver里使用层的一些建议

层的八条定律 当然,这些并非真正的定律,而只是一些有益的忠告,使你免陷于使用层时可能的困顿中。原来有九条定律的,我们精简掉一条,还有下面的八条: 1. 如果你要嵌套层,决不要使用多重父层,应共享一个共同的单一父层。如果你必须使用未在样式表中作完全限定的嵌套层,应在 Netscape4x 中做经常的检查。 2. 总是将文本放在层中的一个表格里 - 表格应该是绝对大小的(以像素为单位,而不是百分比)且不大于层,不过主表中的嵌套表可以设置为相对的百分比大小。这样做可以防止当窗口大小改变时,NC4xx会重新调整文字到不可预期的位置。 3. 决不放置层在表格中。Netscape 4x 将不能正确地理解表格中的层。 4. 总是使用 Netscape Resize Fix 这个插件于任何具有层或 Css 样式的页面。 5. 不要期望当浏览器窗口大小或屏幕分辨率发生变化后,绝对定位的层仍能保持与居中的表格或页面内容的对齐。有插件可用来动态的实现这个效果。 6. 不要试图在层中放置滚动条(用 overflow 属性)- 使用一个 DHTML 滚动器或者 Project Seven IFRAME 技术来代替,对于Netscape 4.x用户,可以在IFRAME中设置一个特定的弹出页面。 7. 决不给层和一幅图像相同的命名 - 每个层应该有自己唯一的并区别于页面中的其它元素的名字(事实上,你不应该让两个具有相同的名称的元素出现在同一个页面中)。

3 次浏览
Dreamweaver基础技巧全面接触
Dreamweaver基础技巧全面接触

很多朋友使用Dreamweaver一段时间后,开始热衷于寻找各式各样的插件,追求各种各样的特效,而对于Dreamweaver中的基本功能反而不去深入研究,其实在Dreamweaver中有很多有用的技巧,如果你多加运用,不仅能提高效率,而且可以实现很多实用的效果。今天我把工作中常用的一些技巧介绍给大家,希望对大家能有些用途,同时也希望能唤起大家深入研究的愿望。我准备根据工作中的不同阶段分别介绍各种技巧。一、 规划阶段――站点窗口的技巧。Dreamweavr的站点窗口常常被很多朋友忽视,其实利用站点窗口我们可以方便的完成很多任务。下面我介绍几个实用的技巧。1、快速添加站点导航。使用站点窗口中的网站地图可以快速制作网站雏形,并可以方便的在个页面之间加入导航链接。首先按如下图标 打开站点地图窗口;选中index.htm文件;点击并拖动站点导航(Site Navigation)窗口中index.htm文件右上角的小圆圈,将它拖动到左边文件窗口中的某一个文件上,如下图所示;Dreamweaver会自动将mydesign.htm的链接加入到index.htm文件中,同样执行此操作并分别指向其他相关链接文件后,导航窗口如下图:此时打开index.htm文件,可以看到相应的连接文字和链接都已经添加好了,我们可以根据需要将他们合理的修改和组织。如图:2、快速修改文件Title。很多时候我们新建的文件往往忽视设定文件Title的内容,事后需要修改时,常常得打开每一个文件分别修改。其实这个工作可以在站点窗口中方便的完成。打开站点窗口View菜单下的Show Page Titles,可以使站点窗口中的文件显示出文件头,而不是原先的文件名。默认的文件头是Untitled Document我们可以分别两次点击,改变默认的文字为我们需要的文件头。如图:3、快速生成站点地图。有时我们需要制作一个包含当前站点所有文件结构的站点地图而找不到合适的方法。Dreamweaver本身就带有这个功能,方法如下:打开File―Save Site Map命令,在弹出对话框中输入保存的文件名,Dreamweaver会在当前站点的根目录下自动生成一个.bmp或.png格式的站点图片。二、 页面布局阶段的技巧。  Dreamweaver不仅仅是一个良好的页面制作工具,同时他还可以进行精确的页面排版和布局,这一部分我们介绍几个页面布局方面的技巧。1、打开辅助表格。搞过设计的朋友都特别希望能精确的定位网页元素,他们喜欢每个元素都能按自己的愿望精确的定位。Dreamweaver自带的Grid功能可以有助于这种希望的实现。执行命令View―Edit Grid打开坐标辅助,可以选择网格状或者是点状显示,同时打开Snap to Grid,以后插入或添加新的元素时,都会按你的设定精确定位。2、利用表格排版页面技巧。合理利用Dreamweaver中的表格功能,可以方便的达到美化页面的目的,下面我介绍几个技巧。1)创建1px边框。有些朋友抱怨Dreamweaver无法做出单像素的表格边框,其实仔细利用表格的属性面板即可做出这种单像素表格。首先使用Object面板插入一个表格,定义表格宽、高及行数和列数。此时Dreamweaver中插入表格的默认CellPad和CellSpace、Border都为0。在属性面板中定义表格的Border为0,CellPad为5(这项可使单元格中的内容与单元格边缘之间保持5个像素);CellSpace为1(此项使得单元格之间保持1个项素的间距)。设置表格的背景色为深色(如#999999),设置单元格的背景色为浅色(如#FFFFFF)。在浏览其中观察效果即可。2)导入数据表格。有时我们需要将一些在Execel文件中创建的表格导入Dreamweaver中,我们可以下将原来的Execel文件另存为带制表符分隔的.txt文本文件。在Dreamweaver中执行Insert―Tabular Date打开如下窗口:添好各个参数后即可将其中的数据导入Dreamweaver的一个表格中。3)格式化表格。如果你对重复的设定各个单元格的参数感到厌烦的话,使用Format Table命令可以帮你快速格式化表格,此命令在Command菜单下,此命令内带多种表格配色方案,你可以选择一种,Dreamweaver会自动将色彩方案应用到你选定的表格上。如图:4、表格和层互转。有的朋友喜欢自由自在的安排他的页面内容,总不喜欢表格的工作方式。其实你完全可以利用灵活的层来安排你的页面内容,当你觉得满意时再将它转换为表格。选中你需要转换的层,执行命令Modify―Convert―Layers to Table。如图:5、同时更新多个框架页面。有是我们需要在点击一个链接时同时更新另外的两个或多个框架页面内容,这可以通过以下步骤使用Dreamweaver的行为来实现。1) 选择链接的文字或图片。2) 打开行为面板(Behaviors),点击加号添加Go to URL行为。3) 在Go to URL对话框中显示了当前已有的所有框架窗口,我们分别选定一个窗口名称,可以分别单独设定每个窗口将要更新的文件内容。Dreamweaver会在设定了目标文件的窗口后面加一个“*”号,表示此框架窗口已设定了URL。4) 完成后点确定即可,我们点此链接,会同时更新多个窗口的内容。三、 内容篇,如何更快更方便得对内容进行组织,是每个朋友都想了解的,下面这几个技巧也许你知道,也许不知道,但重要的是通过不断的运用,你会发现它的优越性的。1、快速标签编辑。对于熟悉手写代码的朋友来说,经常需要切换到代码窗口手工添加一些代码。其实利用Dreamweaver的Quick Tag Editor可以快速插入各种HTML标签,一个是点击属性面板的图标插入,另一种快捷方式是Ctrl+T,这两种方法都会打开快速标签编辑,可以直接从列表中选择需要的源代码标签,如下图:2、快速添加图片边框。对于插入网页中的许多图片都是没有边框的,有时我们需对图片添加边框,我们不需要打开图像处理软件即可实现。一种方法是选中图片后直接在属性面板定义Border为1px,这会给图片添加1像素的边框;另一种方法是定义一个样式,我们可以将img标签直接定义为四边都为1px的样式,则网页中所有插入的图片都会带有相同的边框。如图:3、使用拖动方式增加链接。Dreamweaver支持从文档内直接托动链接到站点内的其他文件,我们可以将站点窗口和文档窗口并排放置,如图:然后选中文档中需要链接的文字,打开属性面版,将链接地址栏后的Point to File指向站点窗口中的目标文件即可,如下图:4、如何加入背景声音。在Dreamweaver中对于一些多媒体声音文件的插入,很多朋友都感到有些困惑,其实很简单,点击Dreamweaver 工作窗口最左下角的 <body> 标签,打开Behavior面板,在弹出的behavior窗口点+号,选择Play Sound,选择你需要的声音文件即可加入。在文档窗口中选中声音文件标识,在属性面板点击Parameters就可以自行设定背景音乐的循环次数、是否自动播放等属性了,如图:四、 美化篇。美化各种网页元素是一件既耗时又不一定出效果的工作,下面我介绍的几个技巧也许能帮你一点忙。1、快速创建配色方案。我们经常需要设定链接各个状态的文字颜色,有些朋友感觉自己的色彩感不太好,总去寻找一些配色手册。其实Dreamweaver本身已经带了一些配色方案,打开Commands―Set Color Scheme命令,我们可以看到有许多成套的配色方案,每个都定义了背景色、文字色、链接各个状态的颜色,你只需选择一种即可,见下图:2、Css链接样式技巧。文字链接一般有四个状态,link、hover、active、visited,我们通常都会对文字链接的各个状态定义不同的色彩和样式,但经常有朋友发现自己定义的样式在浏览时并未像设想的那样。主要原因是在样式表中对链接的定义顺序有一定的要求,正确的顺序是:A:link―A:visited―A:hover。对一般的朋友来说,其实很多时候只是想Hover状态有变化,有个小技巧就是不按上面的方法定义链接样式,而只需定义a和a:hover状态的样式即可,这样只有hover状态的样式与其他状态的不同。修改方法如下图;3、创建不同色彩的连接文字与下划线。普通的链接文字与链接下划线都是相同的色彩,其实我们也可以利用样式表中的Border属性来替代普通链接的划线,由于Border有更多的控制参数和样式,因此只要将Border的色彩和文字的色彩定义的不同即可实现我们的目的。例如我们可以将文字定义为黑色,而在Border选项中定义下划线为红色,如下图;

2 次浏览
Dreamweaver基础技巧全面接触
Dreamweaver基础技巧全面接触

很多朋友使用Dreamweaver一段时间后,开始热衷于寻找各式各样的插件,追求各种各样的特效,而对于Dreamweaver中的基本功能反而不去深入研究,其实在Dreamweaver中有很多有用的技巧,如果你多加运用,不仅能提高效率,而且可以实现很多实用的效果。今天我把工作中常用的一些技巧介绍给大家,希望对大家能有些用途,同时也希望能唤起大家深入研究的愿望。我准备根据工作中的不同阶段分别介绍各种技巧。一、 规划阶段――站点窗口的技巧。Dreamweavr的站点窗口常常被很多朋友忽视,其实利用站点窗口我们可以方便的完成很多任务。下面我介绍几个实用的技巧。1、快速添加站点导航。使用站点窗口中的网站地图可以快速制作网站雏形,并可以方便的在个页面之间加入导航链接。首先按如下图标 打开站点地图窗口;选中index.htm文件;点击并拖动站点导航(Site Navigation)窗口中index.htm文件右上角的小圆圈,将它拖动到左边文件窗口中的某一个文件上,如下图所示;Dreamweaver会自动将mydesign.htm的链接加入到index.htm文件中,同样执行此操作并分别指向其他相关链接文件后,导航窗口如下图:此时打开index.htm文件,可以看到相应的连接文字和链接都已经添加好了,我们可以根据需要将他们合理的修改和组织。如图:2、快速修改文件Title。很多时候我们新建的文件往往忽视设定文件Title的内容,事后需要修改时,常常得打开每一个文件分别修改。其实这个工作可以在站点窗口中方便的完成。打开站点窗口View菜单下的Show Page Titles,可以使站点窗口中的文件显示出文件头,而不是原先的文件名。默认的文件头是Untitled Document我们可以分别两次点击,改变默认的文字为我们需要的文件头。如图:3、快速生成站点地图。有时我们需要制作一个包含当前站点所有文件结构的站点地图而找不到合适的方法。Dreamweaver本身就带有这个功能,方法如下:打开File―Save Site Map命令,在弹出对话框中输入保存的文件名,Dreamweaver会在当前站点的根目录下自动生成一个.bmp或.png格式的站点图片。二、 页面布局阶段的技巧。  Dreamweaver不仅仅是一个良好的页面制作工具,同时他还可以进行精确的页面排版和布局,这一部分我们介绍几个页面布局方面的技巧。1、打开辅助表格。搞过设计的朋友都特别希望能精确的定位网页元素,他们喜欢每个元素都能按自己的愿望精确的定位。Dreamweaver自带的Grid功能可以有助于这种希望的实现。执行命令View―Edit Grid打开坐标辅助,可以选择网格状或者是点状显示,同时打开Snap to Grid,以后插入或添加新的元素时,都会按你的设定精确定位。2、利用表格排版页面技巧。合理利用Dreamweaver中的表格功能,可以方便的达到美化页面的目的,下面我介绍几个技巧。1)创建1px边框。有些朋友抱怨Dreamweaver无法做出单像素的表格边框,其实仔细利用表格的属性面板即可做出这种单像素表格。首先使用Object面板插入一个表格,定义表格宽、高及行数和列数。此时Dreamweaver中插入表格的默认CellPad和CellSpace、Border都为0。在属性面板中定义表格的Border为0,CellPad为5(这项可使单元格中的内容与单元格边缘之间保持5个像素);CellSpace为1(此项使得单元格之间保持1个项素的间距)。设置表格的背景色为深色(如#999999),设置单元格的背景色为浅色(如#FFFFFF)。在浏览其中观察效果即可。2)导入数据表格。有时我们需要将一些在Execel文件中创建的表格导入Dreamweaver中,我们可以下将原来的Execel文件另存为带制表符分隔的.txt文本文件。在Dreamweaver中执行Insert―Tabular Date打开如下窗口:添好各个参数后即可将其中的数据导入Dreamweaver的一个表格中。3)格式化表格。如果你对重复的设定各个单元格的参数感到厌烦的话,使用Format Table命令可以帮你快速格式化表格,此命令在Command菜单下,此命令内带多种表格配色方案,你可以选择一种,Dreamweaver会自动将色彩方案应用到你选定的表格上。如图:4、表格和层互转。有的朋友喜欢自由自在的安排他的页面内容,总不喜欢表格的工作方式。其实你完全可以利用灵活的层来安排你的页面内容,当你觉得满意时再将它转换为表格。选中你需要转换的层,执行命令Modify―Convert―Layers to Table。如图:5、同时更新多个框架页面。有是我们需要在点击一个链接时同时更新另外的两个或多个框架页面内容,这可以通过以下步骤使用Dreamweaver的行为来实现。1) 选择链接的文字或图片。2) 打开行为面板(Behaviors),点击加号添加Go to URL行为。3) 在Go to URL对话框中显示了当前已有的所有框架窗口,我们分别选定一个窗口名称,可以分别单独设定每个窗口将要更新的文件内容。Dreamweaver会在设定了目标文件的窗口后面加一个“*”号,表示此框架窗口已设定了URL。4) 完成后点确定即可,我们点此链接,会同时更新多个窗口的内容。三、 内容篇,如何更快更方便得对内容进行组织,是每个朋友都想了解的,下面这几个技巧也许你知道,也许不知道,但重要的是通过不断的运用,你会发现它的优越性的。1、快速标签编辑。对于熟悉手写代码的朋友来说,经常需要切换到代码窗口手工添加一些代码。其实利用Dreamweaver的Quick Tag Editor可以快速插入各种HTML标签,一个是点击属性面板的图标插入,另一种快捷方式是Ctrl+T,这两种方法都会打开快速标签编辑,可以直接从列表中选择需要的源代码标签,如下图:2、快速添加图片边框。对于插入网页中的许多图片都是没有边框的,有时我们需对图片添加边框,我们不需要打开图像处理软件即可实现。一种方法是选中图片后直接在属性面板定义Border为1px,这会给图片添加1像素的边框;另一种方法是定义一个样式,我们可以将img标签直接定义为四边都为1px的样式,则网页中所有插入的图片都会带有相同的边框。如图:3、使用拖动方式增加链接。Dreamweaver支持从文档内直接托动链接到站点内的其他文件,我们可以将站点窗口和文档窗口并排放置,如图:然后选中文档中需要链接的文字,打开属性面版,将链接地址栏后的Point to File指向站点窗口中的目标文件即可,如下图:4、如何加入背景声音。在Dreamweaver中对于一些多媒体声音文件的插入,很多朋友都感到有些困惑,其实很简单,点击Dreamweaver 工作窗口最左下角的 <body> 标签,打开Behavior面板,在弹出的behavior窗口点+号,选择Play Sound,选择你需要的声音文件即可加入。在文档窗口中选中声音文件标识,在属性面板点击Parameters就可以自行设定背景音乐的循环次数、是否自动播放等属性了,如图:四、 美化篇。美化各种网页元素是一件既耗时又不一定出效果的工作,下面我介绍的几个技巧也许能帮你一点忙。1、快速创建配色方案。我们经常需要设定链接各个状态的文字颜色,有些朋友感觉自己的色彩感不太好,总去寻找一些配色手册。其实Dreamweaver本身已经带了一些配色方案,打开Commands―Set Color Scheme命令,我们可以看到有许多成套的配色方案,每个都定义了背景色、文字色、链接各个状态的颜色,你只需选择一种即可,见下图:2、Css链接样式技巧。文字链接一般有四个状态,link、hover、active、visited,我们通常都会对文字链接的各个状态定义不同的色彩和样式,但经常有朋友发现自己定义的样式在浏览时并未像设想的那样。主要原因是在样式表中对链接的定义顺序有一定的要求,正确的顺序是:A:link―A:visited―A:hover。对一般的朋友来说,其实很多时候只是想Hover状态有变化,有个小技巧就是不按上面的方法定义链接样式,而只需定义a和a:hover状态的样式即可,这样只有hover状态的样式与其他状态的不同。修改方法如下图;3、创建不同色彩的连接文字与下划线。普通的链接文字与链接下划线都是相同的色彩,其实我们也可以利用样式表中的Border属性来替代普通链接的划线,由于Border有更多的控制参数和样式,因此只要将Border的色彩和文字的色彩定义的不同即可实现我们的目的。例如我们可以将文字定义为黑色,而在Border选项中定义下划线为红色,如下图;

1 次浏览
Dreamweaver打造多彩文字链接
Dreamweaver打造多彩文字链接

文字链接可以说是网页中最常见的页面元素了,默认的文字链接样式都是带下划线的效果,这种一陈不变的外观可能使很多朋友都想改变它,以使之符合页面的整体效果,自从样式表得到广泛的应用后,这个愿望现在可以非常方便的实现。今天我给大家介绍利用样式表打造多彩的文字链接效果。我将分为初级篇、进阶篇和高级篇给大家作介绍,所有的链接样式效果我们都将在Dreamweaver的样式编辑器中完成,关于Dreamweaver中的样式编辑器的用法请参考以前的介绍。   一、 准备工作  我们将首先创建一个基本的链接样式,其他的样式将在此基础上添加一个自定义的Class类。  1、 Shift+F11打开样式面板,点击新建样式按钮,如图一;  2、 在Type选项中选择Use Css Selector,创建默认链接样式,如图二;

11 次浏览
共计26043条记录 上一页 1.. 830 831 832 833 834 835 836 ..2605 下一页