推荐阅读
Photoshop鼠绘高挑性感的外国美女图片教程
提供最初的线稿，想学习的朋友最好跟着来一遍，那会比你看一遍领悟得更多：好多朋友喜欢用线稿作为绘画的第一步，不然，不知道怎么画。我不喜欢最后的作品有墨线的痕迹，不过这次我做一个适合大家口味的。 一、起型，就像x光一样，先不考虑其他的，我们把人体的结构画出来……二、描绘衣服，头发……，加一点阴影，对塑造体积有个概念……三、在背景层上面涂上颜色，用的是cs自带的水彩画笔，但是在画笔属性里面添加了画笔压力…… 大致描绘背景……
PS打造朦胧意境之美的梦幻感外景婚纱照
本教程主要运用了Photoshop中的模糊滤镜、图层混合模式、图层样式以及调色处理等，制作出外景婚纱照片的朦胧梦幻感觉，使画面有一种意境之美，效果很不错。在此基础上，大家在处理类似照片时还可以尝试刷上一些星光笔刷之类的点缀，也许会有更好的效果。原图效果教程开始打开图像Ctrl+j复制一层滤镜.模糊.高斯模糊
实例学用CorelDRAW9（十）
十、阴影的建立（海鸥） 不要生气，实例又用海鸥，没办法，我只是太懒了……我不是说过吗？我希望用很简单的实例告诉你C9怎么用，而不是让你学会做这样或那样的实例……我保证下次再不了……这一次，我们将要用到的工具是“交互式下落阴影工具”，呵呵，一听名字就知道很专业……现在，我可以开始实例了？谢谢…… ^_^打开海鸥，启动“互动式下落阴影工具”，这时就可以开始了（就是“互动式渐变工具”菜单里最后一个图标，有阴影的那个）。第二步：做出阴影。在画面上点击鼠标，随意拖动一定距离，松开就可以了。注意，阴影控制线上的白色滑块离黑色块越近，则阴影越深，反之则越浅，你可以试着调节一下。这一步的效果如图51所示。
拍出专业玻璃照片的前期拍摄与后期PS处理技巧
在本教程中我将告诉你如何在前期拍摄和数码后期处理，用最少的照片来拍出专业玻璃照片。您将学习专业照明用光技巧来表现一些惊人的照片和时尚的背景。 使用相同的背景和道具，但使用不同的相机设置。首先，我将介绍两种常见的照片拍摄技巧，然后我会告诉你如何捕获每张照片和后期采取Photoshop的处理步骤。 先欣赏一下最终效果图： 最终效果 第1步：设备的准备 在我们开始之前，你应该准备以下几点： 玻璃(您可以分解成小块)、锤、一个或两个胶袋、手链、两张黑色A4纸或黑色文件夹、台灯、鼎、相机、图形程序。 第2步：收集碎片 在我们开始采取实际的照片，你要把你已经准备好的玻璃打破。这就是为什么你需要一个锤子和塑料袋，因为你肯定不希望这些碎片四处散落。放入袋(或两个杯子，如果你想成为完全相信他们会留在室内)，然后用锤子打几次。(图1) 图1
最新发布
基础（13）什么是网页？网页原理解析。
“网页”是什么，平常我们所听说的“新浪”、“搜狐”、“网易”等，即是俗称的“网站”。而当我们访问这些网站的时候，最直接访问的就是“网页”了。这许许多多的网页则组成了整个站点，也就是网站。所以在这里，我们可以看到网页和网站之间的密切关系了。网页是一种网络信息传递的载体。这种媒介的性质和我们日常的“报纸”、“广播”、“电视”等传统媒体是可以相提并论的。在网络上传递相关的信息，比如文字、图片甚至多媒体音影，都是存储在网页中，浏览者只需要通过浏览网页，就可以了解到相关信息了。SO，网页的功能即是如上。当然，喜欢深究问题的人都会提出疑问：网页到底是由什么组成的呢？如何来制作一张网页？又如何能建立一个网站呢？况且还是需要来建立一个具有动态交互功能的站点。这里需要说明下所谓的“动态交互功能”，举个常见的应用，比如网站访问计数器、客户留言本等一些“动态交互功能”。那么一个网页到底为何？您可以选择一个网站打开，即就可以看到一张网页了。当然首要一个条件就是：您的计算机已经连接了互联网，同时您的电脑需要具有网页浏览器，如果你的机器的操作系统是Windows操作系统，那么则在桌面上双击打开网页浏览器软件：Internet Explorer。如图所示，在浏览器的地址栏中输入一个网址：“http://www.adobe-dreamweaver.cn/”，然后敲击回车键就打开一张网页。网页其实就是一个文件，可以称它为网页文件。其正如一个音乐文件，需要播放器收听一样。网页的显示也需要网页浏览器的支持，目前的主流网页浏览器有Microsoft Internet Explorer、Netscape、Mozilla Firefox以及Opera等。如果您想选择不同的浏览器来浏览网页，则您可以到互联网搜索并免费下载获得以上提及的这些网页浏览器。您会发现，只要是网页浏览器打开的站点，显示的都是网页了。那么您还可以选择查看下它们的“源代码”。以Internet Explorer为例，如下图所示，在当前打开了网页的网页浏览器上，单击【查看】菜单，从下拉菜单中选择【源文件】菜单命令。即打开了一个记事本文件，其里面都是属于网页的一些代码和内容。这些代码就是俗称的HTML标签，内容也就是网页内容了。下面分别简单介绍下：如下图所示的即是一个网页的源代码，它由HTML标签和非标签内容组成。其中的HTML标签起着定义网页标题（如title）、结构（如table表示表格）等各项网页显示时的相关属性。而除了标签以外的则是网页显示的主要内容了，他们主要是文本内容。当然也不尽然，很多时候在网页中显示的内容还是需要HTML标签来定义的（比如网页中显示图像，则需要 img 标签的定义）。总之，网页的代码就是由HTML标签和除标签外的内容组成的整合体。普通常见的多为HTML标签，目前还有一些基于服务器端的网页代码，比如我们常闻的ASP即是。也可以这么说，ASP网页就是由ASP代码与HTML标签以及内容组成的整合体。通过观察，其实网页就是一个张纸。这张纸和平时日常生活中看到的一张宣传画册、海报，没有什么多大的差别（这个差别是说其页面的设计版式和传递表达的信息内容），他们所不同的即是媒介载体的不同。所以，设计一个网页，如同在稿纸上画一幅画一样：使用什么颜色、采用什么结构、表现什么风格，传达什么内容……网页，只是将稿纸上的内容搬到了电脑互联网的实现。
基础（14）将Dreamweaver CS3默认的UTF-8编码改为GB2312
Dreamweaver CS3默认的新建文档的编码是UTF-8，这对于有些只做GB2312编码网站的设计师来说每次都在页面设置中修改有点麻烦。其实我们完全可以将Dreamweaver CS3默认的UTF-8编码修改成GB2312，这样我们以后新建的网页就会是GB2312编码了。首先我们打开Dreamweaver CS3的编辑菜单-选择首选参数设置。如下图：再选择新建文档，默认编码中选择GB2312即可。如下图：
基础（15）学习使用Dreamweaver CS3之前你必须知道的HTML基础知识
在学习Adobe Dreamweaver CS3之前，有些HTML的基础知识你还是需要学习了解的。本文将HTML的标签详细解释了一遍。总类（所有HTML文件都有的） 文件类型 <HTML></HTML> （放在档案的开头与结尾） 文件主题 <TITLE></TITLE> （必须放在「文头」区块内） 文头 <HEAD></HEAD> （描述性资料，像是「主题」） 文体 <BODY></BODY> （文件本体） 结构性定义（由浏览器控制的显示风格） 标题 <H?></H?> （从1到6，有六层选择） 标题的对齐 <H? ALIGN=LEFT|CENTER|RIGHT></H?> 区分 <DIV></DIV> 区分的对齐 <DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV> 引文区块 <BLOCKQUOTE></BLOCKQUOTE> （通常会内缩） 强调 <EM></EM> （通常会以斜体显示） 特别强调 <STRONG></STRONG> （通常会以加粗显示） 引文 <CITE></CITE> （通常会以斜体显示） 码 <CODE></CODE> （显示原始码之用） 样本 <SAMP></SAMP> 键盘输入 <KBD></KBD> 变数 <VAR></VAR> 定义 <DFN></DFN> （有些浏览器不提供） 地址 <ADDRESS></ADDRESS> 大字 <BIG></BIG> 小字 <SMALL></SMALL> 与外观相关的标签（作者自订的表现方式） 加粗 <B></B> 斜体 <I></I> 底线 <U></U> （尚有些浏览器不提供） 删除线 <S></S> （尚有些浏览器不提供） 下标 <SUB></SUB> 上标 <SUP></SUP> 打字机体 <TT></TT> （用单空格字型显示） 预定格式 <PRE></PRE> （保留文件中空格的大小） 预定格式的宽度 <PRE WIDTH=?></PRE>（以字元计算） 向中看齐 <CENTER></CENTER> （文字与图片都可以） 闪耀 <BLINK></BLINK> （有史以来最被嘲弄的标签） 字体大小 <FONT SIZE=?></FONT>（从1到7） 改变字体大小 <FONT SIZE=+|-?></FONT> 基本字体大小 <BASEFONT SIZE=?> （从1到7; 内定为3） 字体颜色 <FONT COLOR="#$$$"></FONT> 链结与图形 链接 <A HREF="URL"></A> 链接到锚点 <A HREF="URL#***"></A>（如果锚点在另一个档案） <A HREF="#***"></A> （如果锚点目前的档案） 链接到目的视框 <A HREF="URL" TARGET="***"></A> 设定锚点 <A NAME="***"></A> 图形 <IMG SRC="URL"> 图形看齐方式 <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE> 图形看齐方式 <IMG SRC="URL" ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM> 取代文字 <IMG SRC="URL" ALT="***"> （如果没有办法显示图形则显示此文字） 点选图 <IMG SRC="URL" ISMAP> （需要CGI程式） 点选图 <IMG SRC="URL" USEMAP="URL"> 地图 <MAP NAME="***"></MAP>（描述地图） 段落 <AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF> 大小 <IMG SRC="URL" WIDTH="?" HEIGHT="?">（以pixels为单位） 图形边缘 <IMG SRC="URL" BORDER=?> （以pixels为单位） 图形边缘空间 <IMG SRC="URL" HSPACE=? VSPACE=?> （以pixels为单位） 低解析度图形 <IMG SRC="URL" LOWSRC="URL"> 用户端拉 <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">（使用端自动更新 ） 内嵌物件 <EMBED SRC="URL"> （将物件插入页面） 内嵌物件大小 <EMBED SRC="URL" WIDTH="?" HEIGHT="?"> 分隔 段落 <P> （通常是两个return） 段落 <P></P> （新定义成容器型标签） 文字看齐方式 <P ALIGN=LEFT|CENTER|RIGHT></P> 换行 <BR> （一个return） 文字部份看齐方式<BR CLEAR=LEFT|RIGHT|ALL>（与图形合用时） 横线 <HR> 横线对齐 <HR ALIGN=LEFT|RIGHT|CENTER> 横线厚度 <HR SIZE=?> （以pixels为单位） 横线宽度 <HR WIDTH=?> （以pixels为单位） 横线比率宽度 <HR WIDTH=%> （以页宽为100%） 实线 <HR NOSHADE> （没有立体效果） 不可换行 <NOBR></NOBR> （不换行） 可换行处 <WBR> （如果需要，可在此断行） 列举（可以巢状列举） 无次序式列举 <UL><LI></UL> （<LI> 放在每一项前） 公布式列举 <UL TYPE=DISC|CIRCLE|SQUARE>（定义全部的列举项） <LI TYPE=DISC|CIRCLE|SQUARE>（定义这个及其後的列举项） 有次序式列举 <OL><LI></OL> （<LI> 放在每一项前） 数标型态 <OL TYPE=A|a|I|i|1> （定义全部的列举项） <LI TYPE=A|a|I|i|1> （定义这个及其後的列举项） 起始数字 <OL VALUE=?> （定义全部的列举项） <LI VALUE=?> （定义这个及其後的列举项） 定义式列举 <DL><DT><DD></DL>（<DT>项目, <DD>定义） 表单式列举 <MENU><LI></MENU>（<LI> 放在每一项前） 目录式列举 <DIR><LI></DIR> （<LI> 放在每一项前） 背景与颜色 重复排列的背景 <BODY BACKGROUND="URL"> 背景颜色 <BODY BGCOLOR="#$$$"> （依序为红、绿、蓝） 文字颜色 <BODY TEXT="#$$$"> 连结颜色 <BODY LINK="#$$$"> 看过的连结 <BODY VLINK="#$$$"> 使用中的连结 <BODY ALINK="#$$$"> 表单（通常需要与CGI程式配合） 定义表单 <FORM ACTION="URL" METHOD=GET|POST></FORM> N2.0 上传档案 <FORM ENCTYPE="multipart/form-data></FORM> 输入栏位 <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET"> 栏位名称 <INPUT NAME="***"> 栏位内定值 <INPUT VALUE="***"> 已选定 <INPUT CHECKED> （适用於checkboxes与 radio boxes） 栏位宽度 <INPUT SIZE=?> （以字元数为单位） 最长字数 <INPUT MAXLENGTH=?> （以字元数为单位） 下拉式选单 <select></select> 下拉式选单名称 <select NAME="***"></select> 选单项目数量 <select SIZE=?></select> 多选式选单 <select MULTIPLE> （多选） 选项 <OPTION> 内定选项 <OPTION selectED> 文字输入区 <TEXTAREA ROWS=? COLS=?></textarea> 输入区名称 <TEXTAREA NAME="***"></textarea> 输入区换行方式 <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></textarea> 表格 定义表格 <TABLE></TABLE> 表格框线 <TABLE BORDER></TABLE> （有或没有） 表格框线 <TABLE BORDER=?></TABLE>（可以设定数值） 储存格左右留白 <TABLE CELLSPACING=?> 储存格上下留白 <TABLE CELLPADDING=?> 表格宽度 <TABLE WIDTH=?> （以pixels为单位） 宽度比率 <TABLE WIDTH=%> （页宽为100%） 表格列 <TR></TR> 表格列内容看齐 <TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> 储存格 <TD></TD> （须与列并用） 储存格内容看齐 <TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> 不换行 <TD NOWRAP> 储存格背景颜色 <TD BGCOLOR=#$$$> 储存格横向连接 <TD COLSPAN=?> 储存格纵向连接 <TD ROWSPAN=?> 储存格宽度 <TD WIDTH=?> （以pixels为单位） 储存格宽度比率 <TD WIDTH=%> （页宽为100%） 表格标题 <TH></TH> （跟<TD>一样，不过会对中并加粗） 表格标题对齐 <TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM> 表格标题不换行 <TH NOWRAP> 表格标题占几栏 <TH COLSPAN=?> 表格标题占几列 <TH ROWSPAN=?> 表格标题宽度 <TH WIDTH=?> （以pixels为单位） 表格标题比率宽度<TH WIDTH=%> （页宽为100%） 表格抬头 <CAPTION></CAPTION> 表格抬头看齐 <CAPTION ALIGN=TOP|BOTTOM>（在表格之上/之下） 视框（定义与控制萤幕上的特定区域） 视框格式总定义 <FRAMESET></FRAMESET> （取代<BODY>） 视框行长度分配 <FRAMESET ROWS=,,,></FRAMESET>（pixels 或 %） 视框行长度分配 <FRAMESET ROWS=*></FRAMESET> （* = 相对大小） 视框栏宽度分配 <FRAMESET COLS=,,,></FRAMESET>（pixels 或 %） 视框栏宽度分配 <FRAMESET COLS=*></FRAMESET> （* =相对大小） 定义个别视框 <FRAME> （定义个别视框） 个别视框内容 <FRAME SRC="URL"> 个别视框名称 <FRAME NAME="***"|_blank|_self|_parent|_top> 边缘宽度 <FRAME MARGINWIDTH=?> （「左」与「右」边界） 边缘高度 <FRAME MARGINHEIGHT=?> （「天顶」与「地底」边界） 卷动条 <FRAME SCROLLING="YES|NO|AUTO"> 不可改变大小 <FRAME NORESIZE> 无视框时的内容 <NOFRAMES></NOFRAMES>（如果浏览器不提供视框功能的话） 杂项 说明 （浏览器不会显示） 档案型态声明 <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN"> 档案型态声明 <!DOCTYPE HTML PUBLIC "-//W3O//DTD W3 HTML 3.0//EN"> 可搜寻 <ISINDEX> （指示可搜寻的索引项） 提示 <ISINDEX PROMPT="***"> （要求输入的提示文字） 送出搜寻条件 <A HREF="URL?***"></a> （其中的问号不是数字，而是「问号」） 基本档案的URL <BASE HREF="URL"> （必须放在「文头」区段内） 基本视窗名称 <BASE TARGET="***"> （必须放在「文头」区段内） 相关性 <LINK REV="***" REL="***" HREF="URL"> （必须放在「文头」区段内） 背景资讯 <META> （必须放在「文头」区段内）
基础（16）你必须了解的网页设计常用度量单位
一、长度单位长度单位是Web页设计中最常用的一个单位。一个排列无序、杂乱无章的页面不可能给人们留下什么好的印象。于是，在设计的时候需要为元素的位置、尺寸精确地定义一些值，以使其达到预期的效果。CSS的主要功能之一就是CSS定位，这个定位的概念即包括位置的定位，也包括尺寸的定位。无论哪一种，都需要使用长度单位，不然，精确定位就无从谈起。在CSS中，长度是一种度量尺寸，用于宽度、高度、字号、字和字母间距、文本的缩排、行高、页边距、贴边、边框线宽以及许许多多的其他属性。1.定义长度在Dreamweaver 中要定义长度，首先应该在所选择的选项后面的文本框中写符号部分，这个符号可以是“+”(正号)，表示正长度值，也可以是“-”(负号)，表示负长度值。如果不写符号，那么默认值是“+”。在符号后紧接着是一个数值，这个数值可以是整数，也可以是小数。然后再在该选项的长度单位下拉列表框中选择一种长度单位。长度单位一般是一个由两个字母组成的单位缩写，例如cm，pt，em等。2.绝对长度单位网页定义上常常使用的绝对长度值由厘米(cm)、毫米(mm)、英寸(in)、点(pt)、派卡(pc)等等。单位 英寸(in) 厘米(cm) 毫米(mm) 磅(pt) 派卡(pc)英寸 1.0 2.54 25.4 72 6派卡 0.16667 0.4233 4.233 12 1.0厘米 0.3937 1 10 28.3464 4.7244毫米 0.03937 0.1 1.0 2.83464 0.47244磅 0.01389 0.0352806 0.352806 1.0 0.83333绝对长度值的使用范围比较有限，只有在完全知道外部输出设备的具体情况下，才使用绝对长度值。也就是说，绝对长度值最好用于打印机输出设备，而在仅仅作为屏幕显示时，使用绝对长度值意义不大，应该尽量使用相对长度值。3.相对长度值每一个浏览器都有其自己默认的通用尺寸标准，这个标准可以由系统决定，也可以由用户按照自己的爱好进行设置。因此，这个默认值尺寸往往是用户觉得最适合的尺寸。于是使用相对长度值，就可以是需要定义尺寸的元素按照默认大小为标准，相应地按比例缩放。这样就不可能产生难以辨认的情况。其实，百分比单位以及关键字都能产生相类似的效果。CSS还支持下列三种长度的相对单位：em(当前字体中字母M的宽度)、ex(当前字体中字母X的高度)、px(一个象素的大小)。使用em和ex的目的就是为所给的字体设置合适的宽度，而没有必要知道字体有多大，在显示时，可通过比较当前字体中的M和X来确定。字体越大，所对应的em和ex也就越大。以象素为单位的长度是相对于显示器上的象素(或许为方形)的高度和宽度。影像的宽度和高度经常是以象素给出的。象素测量法通常不是个好方法。首先，象素的大小依分辩率变化较大，大多数用户都会将显示器设置成尽可能高的分辩率，从而导致象素太小，而无法阅读。二、百分比单位在Dreamweaver 中要使用百分比，首先应该在所选择的选项后面的文本框中写符号部分，这个符号可以是“+”(正号)，表示正长度值，也可以是“―”(负号)，表示负长度值。如果不写符号，那么默认值是“+”。在符号后紧接着是一个数值，符号后面可以输入任意值，但是由于在某些情况下，浏览器不能处理带小数的百分数，因此最好不用带小数的百分比。然后再在该选项的长度单位下拉列表框中选择“%”。百分比总是相对于另一个值来说的。那个值可以是长度单位或是其他的。每一个可以使用百分比值单位指定的属性同时也自定义了这个百分比值的参照值。大多数情况下，这个参照值是此元素本身的字体大小。三、颜色单位大量地使用图片可能会使网页富有生气。但是，每一个上过网的人都有为等待一个图片而焦急不安的经历。其实，适当地在不同的部位使用不同的颜色，也能起到类似图片的效果，把读者的注意力吸引到关键的部分，然而，下载网页的时间却大幅度地减少了。color属性用来定义一个元素的前景颜色，在大多数情况下，这个元素中所包含的使文本对象。使用color属性同时还可以用来决定一个元素边框的颜色。通用的定义颜色的语法是：color：颜色值。定义颜色值最简单也最直接的方法是使用百分比值。在这种情况下，红、绿、蓝颜色值的等级用百分比数来确定。格式是：color:rgb(R%,G%,B%)。使用百分比值来指定颜色还有一个好处是它能够声明一组真正的数字，不论它的值是多少。指定颜色的另一种方法是使用范围在0～255之间的整数来设置。格式是color:rgb(128,128，128)。定义颜色的第三种方法是使用十六进制数组定义颜色。这种定义的方法对于经常进行程序设计的人来说比较熟悉。定义颜色时使用三个前后按顺序排列的十六进制数组表示，例如“#FC0EA8”。这种定义的方式就是形如#RRGGBB的格式。即在红、绿、蓝的位置上添上需要的十六进制值。四、URL单位URL单位和链接的地址有关。所谓URL就是“Uniform Resource Locator”的简写，链接是网页的灵魂。通过链接的方式可以使各个网页之间联接起来，使网站中众多的页面构成一个有机整体，使访问者能够在各个页面之间跳转。链接可以是一段文本，一幅图像或其他网页元素，当在浏览器中用鼠标单击这些对象时，浏览器可以根据其指示载入一个新的页面或者跳转到页面的其他位置。在创建链接的过程中，路径是非常重要的。Dreamweaver 中有两种路径：绝对路径和相对路径，其中相对路径可分为和根目录相对的路径及和文当相对的路径。绝对路径时含服务器协议(在网页上通常是http://或ftp://)的完全路径。绝对路径包含的是精确位置而不用考虑源文档的位置。但是如果目标文档被移动，则链接无效。创建对当前站点以外文件的链接时必须使用绝对路径。和根目录相对的路径总是从当前站点的根目录开始。站点上的所有可以公开的文件都存放在站点的根目录下。和根目录相对的路径使用斜杠告诉服务器从根目录开始。例如，/ Dreamweaver /index.html将链接到站点根目录Dreamweaver文件夹的index.html文件。如果要在内容经常被移动的环境中链接文件，那么使用和根目录相对的路径往往是最佳的方法。在使用与根目录相对的路径时，包含链接的文档在站点内移动，链接不会中断。但是，和根目录相对的路径和适合于本地查看站点，在这种情况下，可以使用和文档相对的路径。注意：当在浏览器中按照本地方式预览文件时，和根目录相对的路径所链接的内容不会出现。这是因为浏览器不能像服务器那样识别站点根目录，要预览和根目录相对的路径所链接的内容，必须将文件放置到远程服务器并从那里进行查看。和文档相对的路径是指和当前文档所在的文件夹相对的路径。例如文档test.swf在文件夹Flash中，它指定的就是当前文件夹内的文档。… /test.swf指定的则是当前文件夹上级目录中的文档;而/test/test.swf指定是 Flash文件夹下test文件夹中的test.swf文档。和文档相对的路径通常是最简单的路径，可以用来链接总是和当前文档在同一文件夹中的文件。注意：在创建和文档相对的路径之前必须保存新文件，因为在没有定义起始点的情况下，和文档相对的路径是无效的。在文档保存之前，Dreamweaver 会自动使用以File://开始的绝对路径。
基础（18）在Dreamweaver CS3中加入CSS样式表的四种方法
给初学者介绍一下CSS特点及如何在网页中使用已经设置的CSS。W3C(The World Wide Web Consortium)把动态HTML(Dynamic HTML)分为三个部分来实现:脚本语言(包括JavaScript、Vbscript等)、支持动态效果的浏览器(包括Internet Explorer、Netscape Navigator等)和CSS样式表。层叠样式表的特点且不说过去的网页缺少动感，就是在网页内容的排版布局上也有很多困难，如果不是专业人员或特别有耐心的人，很难让网页按自己的构思和创意来显示信息。即便是掌握了HTML语言精髓的人也要通过多次地测试，才能驾驭好这些信息的排版，过程十分漫长和痛苦。样式表就是在这种需求下诞生的，它首先要做的是为网页上的元素精确地定位，可以让网页设计者象导演一样，轻易地控制由文字、图片组成的演员们，在网页这个舞台上按剧本要求好好地表演。其次，它把网页上的内容结构和格式控制相分离。浏览者想要看的是网页上的内容结构，而为了让浏览者更好地看到这些信息，就要通过格式控制来帮忙了。以前两者在网页上的分布是交错结合的，查看修改很不方便，而现在把两者分开就会大大方便网页的设计者。内容结构和格式控制相分离，使得网页可以光由内容构成，而将所有网页的格式控制指向某个CSS样式表文件。这样一来的好出表现在两个方面:第一，简化了网页的格式代码，外部的样式表还会被浏览器保存在缓存里，加快了下载显示的速度，也减少了需要上传的代码数量(因为重复设置的格式将被只保存一次)。第二，只要修改保存着网站格式的CSS样式表文件就可以改变整个站点的风格特色，在修改页面数量庞大的站点时，显得格外有用。避免了一个一个网页的修改，大大减少了重复劳动的工作量添加层叠样式表的方法我们为网页添加样式表的方法有四种：1.最简单的方法是直接添加在HTML的标识符(tag)里:举个例子:代码说明:用蓝色显示字体大小为10pt的“CSS实例”。尽管使用简单、显示直观，但是这种方法不怎么常用，因为这样添加无法完全发挥样式表的优势“内容结构和格式控制分别保存”。2.添加在HTML的头信息标识符< head>里:type=”text/css”表示样式表采用MIME类型，帮助不支持CSS的浏览器过滤掉CSS代码，避免在浏览器面前直接以源代码的方式显示我们设置的样式表。但为了保证上述情况一定不要发生，还是有必要在样式表里加上注释标识符“< !--注释内容-->”。3、链接样式表同样是添加在HTML的头信息标识符< head>里:*.css是单独保存的样式表文件，其中不能包含< style>标识符，并且只能以css为后缀。Media是可选的属性，表示使用样式表的网页将用什么媒体输出。取值范围:・Screen(默认):输出到电脑屏幕・Print:输出到打印机・TV:输出到电视机・Projection:输出到投影仪・Aural:输出到扬声器・Braille:输出到凸字触觉感知设备・Tty:输出到电传打字机・All:输出到以上所有设备如果要输出到多种媒体，可以用逗号分隔取值表。Rel属性表示样式表将以何种方式与HTML文档结合。取值范围:・Stylesheet:指定一个外部的样式表・Alternate stylesheet:指定使用一个交互样式表4、联合使用样式表同样是添加在HTML的头信息标识符< head>里:以@import开头的联合样式表输入方法和链接样式表的方法很相似，但联合样式表输入方式更有优势。因为联合法可以在链接外部样式表的同时，针对该网页的具体情况，做出别的网页不需要的样式规则。需要注意的是:・联合法输入样式表必须以@import开头。・如果同时输入多个样式表有冲突的时候，将按照第一个输入的样式表对网页排版。・如果输入的样式表和网页里的样式规则冲突时，使用外部的样式表。
基础（20）使用Dreamweaver CS3文件库功能快速更新网站
往往我们在建立一个较为大型的网站的时候会有很多的副页面框架模式甚至一些小的细节元素都是相同的，但是令人困扰的是在更新它们时却要费些周折，要一遍遍的反复更新每一个页面中的元素。现在我们可以对那个时代说再见了，因为DW引入了"库"这个概念。我们可以利用它来批量的更新网站中相同的元素。大至整个页面框架，小至一个字符！ 库的引入在DW3中还不很完善，但在DW4以近完美。下面就让我们来看一下如何利用库来更新站点： 一、库文件的建立建立库文件有两种方法，一是在编辑状态下选定一个元素，然后打开库面板(F11键-在弹开的Assets中选择图标为翻开的书本样的标识)按下。那么DW就会自动的建立一个后缀名为＂.LIB＂的文件将该元素读到这个文件当中，同时会在本地站点中建立一个＂Library＂文件夹。它代表了每一个库文件都是独立的，当我们上传本地站点到远程服务器中时，要将该文件一并上传；第二种方法是打开库面板，在白色的文件记录区域点击右键，选择弹开的列表中的New Library Item(新的库项目)，建立一个空白的库文件，然后双击打开进行编辑。第一种方法适用于文本＼图像＼链接等小元素的库文件建立。第二种方法适用于大规模的整篇幅的库文件的建立，绝大多数情况下，大规模库文件的建立都是和模板配合使用的。 二、库文件的应用与编辑 我们建立了一些简单的库文件，其中包括连接＼图像＼表格。它们每一个都可以被理解为一个单一的元素插入到编辑区使用，只要从库面板中直接拖拽它们到需要的地方就可以了。需要注重的是，插入的库文件是锁定状态的。它们的显示方式是淡黄色的。选定一个库文件查看代码，你会发现如下的标签＂＊＊＊＂这代表了一个完整的库文件，有开始有结束。你可以更改标签的位置，但不要删除它们，那样的话该库文件就被破坏而返回到纯编辑状态。 编辑库文件的方法有两种，一是在库面板文件记录区中双击某个库文件进入编辑状态。二是选定一个库文件点击右键在弹开的列表中选择Open Library Item(打开库项目)进入编辑状态。当我们编辑完成并保存库文件后，处于编辑状态下的正在使用该文件的页面会自动更新。假如有其他的非编辑状态的页面也使用了该库文件，那么DW会自动的弹出一个提示框。询问是否同步更新本地站点内所有使用该文件的页面。这个功能也就是库文件的最大优点。我们制作完成站点以后将所有文件连同库文件夹一并上传到远程服务器中，那么当我们在连接远程站点的状态下更改某个库文件时，同样的会得到DW的提示。询问是否同步更新全部站点中使用了该库文件的所有页面。点击ok键，远程站点中的文件便得到了更新，完全不需要一点点的反复更新每一个文件。 到这里为止，我们对库的使用以有了一个大概的了解。至于该功能的熟练使用就要靠自己多动手了。相信该功能会给您站点更新带来极大的方便。
基础（21）Dreamweaver CS3 中Head元素详解及使用
HEAD元素中包含了许多重要的信息，例如文档类型、语言编码、JavaScript和VBscript的函数和变量、搜索引擎的要害字和内容提示等。您可以使用VIEW-HEAD CONTENT或HTML检查器(F10)查看其内容。 要将元素插入文档的HEAD部分请选OBJECT面板的HEAD，下面介绍一下HEAD元素的部分属性：Meta:它可以记录当前页面的信息，例如字符编码、作者、版权和要害字等。还可以用来向服务器提供信息，例如截止日期和页面刷新间隔等。 Attribute:指定META标签是否包含页面描述信息(NAME)或HTTP标题信息(HTTP EQUIV)。 Value:指定所提供信息的类型。有些值是已经定义好的，在DW中有专门的属性检查器。例如description(说明)、keyword(要害字)、refresh(刷新)等。还可以指定其他任意值，如：creationdate(创建日期) 、document ID(文档编号)和level(等级)等。 Content:实际内容。如：假如指定level(等级)为Value(值)，则Content可能是beginner(初级)、intermediate(中级)、advanced(高级)。 Title:页面标题，显示在浏览器的标题栏上。Keywords:许多流行的搜索引擎可自动阅读Meta标签中的Keywords内容，并使用该信息在其数据库中建立对该页面的索引。有些搜索引擎在建立索引是对要害字或字符有数量上的限制。有些则在要害字超出限定范围是忽略所有要害字。因此为网页精选要害字是很有必要的。在标志为Keywords的域中可以使用逗号分隔要害字。Description:许多流行搜索引擎可自动阅读Meta 标签中的Description内容，有些引擎使用该信息在其数据库中建立对该页面的索引，有些则将该信息显示在搜索结果中对该页面的链接下面，而不是在文档的开头几行。有写搜索引擎在建立索引是对字符数有一定的限制，因此应尽量言简意赅。Refresh:使用Refresh元素可以指定在某一时间段后自动对页面对页面进行刷新。 Action:指定是否要转到其他URL或刷新当前页面。要转到其他URL，可单击Brower按钮选择要载入的页面。 Delay:是在刷新页面之前以秒为单位的等待时间，要立即刷新页面，可以在此域中输入0。 Base:使用Base元素可设置基本URL。Href:指定基本URL，可直接键入路径或选择。 Target:指定所有链接的文档要打开的窗口。可以在当前框架集中选择一个框架或在其提供的四种保留窗口中选择其一，默认为_self。 Link:使用Link元素可定义当前文档和其他文件之间的关系。 Href:是要定义关系的文件的URL。可以直接键入或选择。 ID：指定某链接的唯一标识符。 Title:说明链接的关系。此属性对链接样式表非常合适。 Rel:指定当前文档和Href域中文档之间的关系。其可能的值包括：Alternate(备选)、Stylesheet(样式表)、Start(启动)、Next(下一个)、Prev(上一个)、Content(内容)、Index(索引)、Glossary(词汇)、C opyright(版权)、Chapter(章)、Section(节)、Subsection(小节)、Appendix(附录)、Help(帮助信息)、Bookmark(书签)等。要指定多个关系，请使用空格将值分开。
基础（22）用Dreamweaver CS3制作动态链接的Flash按钮
Dreamweaver 4.0 以上的版本都提供了“插入Flash按钮”功能。如下面演示中的flash按钮，就是由Dreamweaver制作并插入的。这里先介绍一下普通的flash按钮的制作方法，以Dreamweaver MX为例：新建一个HTML文件，并先保存它。然后在“Insert（插入）”菜单的“Media（多媒体）”标签中，点击“Flash Button（Flash 按钮）”按钮，弹出如图所示的对话框。在对话框的“Style（样式）”项，选择“Slider”，“Button Text（按钮文字）”填入“发布新帖”，“Font（字体）”选择“方正粗倩简体”（需要另外安装），“Link（链接）”填入“newthread.php”，“Save As（保存为）”填入“newthread.swf”，最后点击“OK”按钮即可。这样做出来的按钮，其链接是无法改变的。当需要改变其链接时，只好重新做一个了。这还可以容忍，但假如是在动态的页面中，例如社区的一个子论坛中，在“forum.php?id=1”页面的按钮的链接为“newthread.php?id=1”，而在“forum.php?id=2”页面的按钮的链接则为“newthread.php?id=2”，用这个方法做出来的flash按钮就只能望洋兴叹了。有没有办法做出动态链接的flash按钮，让该按钮读取网页上设定的值，而链接到该值指定的页面呢？答案是肯定的。下面小阳将为你介绍实现方法：制作flash按钮前，先在“Insert（插入）”菜单的“Forms（表单）”标签中，点击“Hidden Field（隐藏域）”按钮，若出现提示“Add Form Tag?（添加表单标记吗？）”，假如没有其他需要，可选择“No（否）”。然后如下图，在“Properties（属性）”窗口中，修改该隐藏域的名称为“flashbuttonlink”，Value值为“newthread.php”，此Value值即为以后flash的链接值。然后按照以上所介绍的插入flash按钮的方法创建一个flash按钮，所不同的是，“Link（链接）”值请填入“javascript:window.location=flashbuttonlink.value”，且“Target（目标）”值请留空或选“_self”，如图。OK，动态的flash按钮已经做好了！假如要改变链接的值，则改变隐藏域“flashbuttonlink”的Value值即可。在论坛等动态页面中自动创建不同的链接，也就可以向用户端输出不同的“flashbuttonlink”的Value值而实现，这就不用我多说了吧？
Micromedia Dreamweaver UltraDev 安装及使用教程(二)
二、界面介绍 下面我们就可以开始使用 Dreamweaver Ultradev 了，首先让我们熟悉一下它的操作界面。它的操作界面由主菜单、状态栏、工作区和浮动面板组成。（图六） 图6 Micromedia Dreamweaver UltraDev 的主菜单共分十大类：File, Edit, View, Insert, Modify, Text, Commands, Site，Window, Help，作用分别为文件管理、选择区域文本编辑、观察对象、插入元素、修改页面元素、文本操作、附加命令项、站点管理、所有浮动面板切换和窗口切换和联机帮助。下面着重介绍一下各菜单的主要功能。 首先我们先了解 File 菜单的功能。File 菜单中主要有新建、打开和保存文件、模板和分帧文档的功能。主要介绍以下几个选项。 Revert：将文档恢复至上次存盘时的状态。 import：包括引入 XML 到模板中，引入 Word 文档和引入表格数据文件。 EXPort Css styles：将窗口中的 CSS 样式表定义语句转换为一个.css 文档。 Export Editable Regions as XML：将窗口的模块转换为 XML 文档。 3.0 Browser compatible：将窗口文档转换为 3.0 版本浏览器兼容格式。 Tables to Layers：将窗口表格均转换为层形式。 Preview In Browser：将窗口文档在您设定的浏览器中打开（以 TMP*** 打头）。 This Document：在当前文档中检查有无出错链接。 Entire Site：在您当前设定网站的所有 HTM 文档中检查有无出错链接链接。 Check Target Browsers：可以将当前文档用不同的浏览器诊断，从而可以了解您的 HTM 文档在不同的浏览器的兼容性和正确性。 Edit 菜单主要包括：撤消/恢复操作，剪切、拷贝、粘贴和查找替换功能。其中 Launch External Editor：用来启动外部编辑器，这是 DREAMWEAVER 的一大优点，它允许您附上您熟悉的 HTML 编辑器一同工作，如果在任一方修改并保存后，另一方编辑器会自动检测，并提醒您重载入或取消（cancel）。另外，Preferences：进行工作参数设定，包括选择外部编辑器、FTP、浏览器设定、层、默认字体等众多参数。 View 菜单主要用来查看各对象。 Head Content：显示 HTML 文档头部的设置状况。 Invisiable Elements：显示隐藏标签，如锚、备注、SCRIPT、空格等。 Tracing Images：它可以将一幅图片嵌入页面的任何一个位置，而且可以改变透明度，这时 BODY 中的背景设置将会在 DREAMWEAVER 预览界面中失效，但在任何一个浏览器都不会起作用，图片格式可以为：JPG, GIF, PNG。 Plugins：用来控制窗口文档中的插件的播放。 Prevent Layer Overlaps：防止层与层交叠，选上此项后，当您再画层时，若靠近原来的层时，会出现一个 STOP 的标志。 Insert 菜单，用来插入各种对象，包括：插入图象、表格和直线；层、JAVA 小程序、ActiveX 对象、插件、FLASH、SHOCKWAVE 对象，以建立一个互动图象；另外还可以插入一个表单、锚链接和备注。唉唉，很多，您还是一个个去试试吧！ Modify 菜单主要用来修改页面元素。几个重要功能介绍如下： Page properties：修改当前窗口文档的属性，包括背景、背景色、链接色彩、字符串编码、文档标题等。 Selection properties：弹出属性浮动面板，并显示当前所选元素的相应参数，比如当前所选为字体，则弹出的属性服动面板显示的将为字体的所有相关属性。 Table：这部分的子菜单均是针对于表格进行操作的，功能比较强大，使用灵活。用户可以逐渐熟悉，相信很快就会学会的。 Layout: 版面编排。 Reposition content using Layers：设置页面布局，分别为预防层重叠、显示层的浮动面板、显现栅格、对齐网格。 Convert Layer to Tables...：此选项用于将页面中的层转换成表格结构。 Library：库，这概念在 DREAMWEAVER 中属于高级开发，此项中的下级菜单分别为创建一个新的库、更新当前页、更新整个站点。 Template：模块，感觉上功能与 Library 的功能很相似，都是建立一个固定模型，然后在其它页面中可以反覆调用，以提高效率。其选项中的下拉菜单均是对模块的控制。 Add object to Linetime：将选取的对象加入到时间链中，这里所指的对象只能是层或图象。 Add Behavior to Linetime：在时间链中加入动作，以指定任意一帧触发事件。Record Path of Layer：利用这个选项您可以将一层中的元素任意调整它的路径，这样您可以用它来实现页面元素的曲线运动。 Timeline：此项目是对时间链的修改设置，体现页面的动态效果。你的页面一定会充满动感，引人入胜！ Text 菜单集中对文字进行操作，比较简单。这里只说明一下 CSS 选项。 Custom Style（Selection）：这就是 CSS 了，如果您已经定义 CSS 样式表，那么此选项将出现您定义的标识符，不过如果您定义的是 HTML 标签，比如 TD、BODY 之类那么它们不会出现在列表之中，最后的一个选项可以编辑 CSS 样式，并会列出您定义过的所有的 CSS。 Commands 这组命令很实用，让我们理解 Commands 菜单功能： Clean Up HTML：这就是除去 HTML 垃圾代码的工具。其中的对话框中有几组复选框可供选择，如空标签、多余的无用的嵌套、DREAMWEAVER 备注，还可以自己设定要清除的特定标签。 Set color scheme：色彩配置向导，这里有许多已经匹配的背景色、文本色、超链接色，您只要选择就可以直接运用到文本中去。 Format Table：提供了许多已有的表格格式，您只要选择就可直接使用。 Site 菜单主要是对站点进行管理的，包括新建站点、打开已有的站点和站点文件的定义等。 Windows 这组命令均是对浮动面板的操作，每个浮动面板均对应一个功能键，方便用户切换。其实熟悉 Dreamweaver3 的朋友一定对此不会陌生。其它菜单选项你还是自己去体会体会吧！ 它的用户界面是不是十分出色？除了主菜单外，其他菜单按钮均高度集成在一块块浮动面板上， 大大方便了网页的制作。你一定会感到很方便的！ 除了主菜单外，Micromedia Dreamweaver UltraDev 1.0 主要的编辑功能菜单只是用 3 条浮动的菜单栏代替，即对象面板（Object）、属性面板（Properties）、快速启动档(Launcher),其中快速启动档也同时集成在状态栏上，对象面板中集成了相当于四个面板的元素（Common, Form, Head, Invisible），您可以任意移动这些菜单栏的位置，尽量留出更多的可视区域。Dreamweaver UltraDev 这种软件界面扩展设计者视野，不再受制于屏幕显示的大小，而 Dreamweaverr UltraDev 又提供了标尺刻度及底格功能，你可以直接看到页面的实际显示尺寸，使得设计者在页面定位方面更加清晰明了，无须浏览器预览就清楚主页的整体页面效果，这个功能让我们感到好像我们不是在制作主页，而是在 Photoshop 中作图。
Dreamweaver技巧：朦胧就是美
在网页的图片处理中，半透明是经常要用到的图片效果，它可以半遮半现地显示图片下面的元素。利用这一点我们可以做出很多种效果，例如烟雾效果等。今天在这里就讨论如何在Dreamweaver 4中设置和使用这种效果。 设置步骤： 1. 在Dreamweaver 4中点“window”→“Css Styles”(或按键盘的“shift+F11”),调出CSS Styles窗口。 2. 在CSS Styles窗口中，单击右下角的加号，弹出New Style窗口。图中的“Name”是建立的Class的名称，Class名字的格式是 “.XXXXX”（前面一定要有个点）；“Type”的右边有三个选项，由上到下分别是：建立一个Class、重新定义标签（网页元素）、选择伪类；“Define” 的右边有两个选项：上面指建立外部的CSS文件（选中这个后，你所建立的CSS不是嵌入你的网页，而是成为单独的一个CSS文件，供网页调用，大网站都是此种做法）；“this Document only”是指直接在当前页中建立CSS。 3.点“OK”，弹出一个大窗口Style definition for .clarity，我们按照图2设置。 在图2中，除了*Filter外，别的选项不要管它。在*Filter右边的下拉菜单中选择Alpha。也许你已经注意到了图2中的这一段代码“Alpha(Opacity=?, FinishOpacity=?, Style=?, StartX=?, StartY=?, FinishX=?, FinishY=?)” 里面有很多问号，这些需要我们用参数来代替它们： （1） “Opacity”代表透明度水准。它的范围是0～100，其实就是百分比的意思。如果想变为全透明，就用0代替Opacity后面的问号； （2） “FinishOpacity”是用来指定结束时的透明度。其范围跟Opacity一样（FinishOpacity为可选参数，不想要的话可以去掉它。）； （3） “Style”是指定透明区域的形状特征。0代表统一形状，1代表线形，2代表放射形，3代表长方形； （4） “StartX”与”StartY”代表渐变效果开始的X与Y坐标。一般我们设置为StartX=0, StartY=0（这样表示透明效果是从图片的左上角开始）； （5） “FinishX”与“FinishY”代表渐变效果结束时的横纵坐标。这里很关键，填什么数值那就要看你的图片的高与宽了，假设我们的图片高与宽分别是100、200像素，那么就可以写成FinishX=200， FinishY=100。（如果你只想要一半的面积是透明，那么可以设置成FinishX=100， FinishY=50）。 设置好这些参数后，就点击“OK”。设置的步骤到此就算完成了。 使用步骤： 1. 在Dreamweaver 4中插入一图，假设其像素高为100，宽为200（为了能看到效果，这里把网页的背景设为鲜红。 2. 再次调出CSS Styles窗口（参见设置步骤），在CSS Styles窗口中，应该有个Clarity， 3. 选中刚才插入的图，用鼠标单击“Clarity”。 4. 到这里就大功告成了。你可以按键盘的 F12来预览一下。（注意，这种特效在编辑状态下是不可见的，一定要在预览状态下才可见。）