幻龙网络 » dreamweaver教程 http://www.01on.com 一个教你如何制作网页的地方 Tue, 15 Jul 2008 04:07:04 +0000 http://wordpress.org/?v=2.5.1 en 怎样在Dreamweaver里插入视频文件 http://www.01on.com/a/438.html http://www.01on.com/a/438.html#comments Wed, 28 Nov 2007 05:45:55 +0000 admin http://www.01on.com/a/438.html >]]> 　　Dreamweaver本身并没有插入视频的功能，要想播放视频，可以直接在Dreamweaver的代码视图中插入如下代码：

1.avi格式

<object classid=CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95
codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab
#Version=5,1,52,701 height=180 id=NSPlay type=application/x-oleobject width=240
VIEWASTEXT standby="加载 Microsoft Windows Media Player 组件…">
<param name="FileName" value="">
<param name="AutoStart" value="true">
<param name="AutoRewind" value="-1">
<param name="AnimationAtStart" value="false">
<param name="ShowControls" value="false">
<param name="ClickToPlay" value="false">
<param name="EnableContextMenu" value="true">
<param name="EnablePositionControls" value="false">
<param name="Balance" value="0">
<param name="ShowStatusBar" value="false">
<param name="AutoSize" value="0">
<embed type="application/x-mplayer2"
pluginspage="http://www.microsoft.com/Windows/Downloads/Contents/Products/MediaPlayer/"
filename src autostart="false"
enablecontextmenu="false"
clicktoplay="false"
enablepositioncontrols="false"
showcontrols="0" showstatusbar="1"
showdisplay="0" width="240" height="180">
</embed>
</object>

或者

 

<object id="video" width="400" height="200" border="0"
classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">
<param name="ShowDisplay" value="0">
<param name="ShowControls" value="1">
<param name="AutoStart" value="1">
<param name="AutoRewind" value="0">
<param name="PlayCount" value="0">
<param name="Appearance value="0 value=""">
<param name="BorderStyle value="0 value=""">
<param name="MovieWindowHeight" value="240">
<param name="MovieWindowWidth" value="320">
<param name="FileName" value="file:///D|/work/vod/Mbar.avi">
<embed width="400" height="200" border="0" showdisplay="0" showcontrols="1"

autostart="1" autorewind="0" playcount="0" moviewindowheight="240" moviewindowwidth="320"
filename="file:///D|/work/vod/Mbar.avi" src="Mbar.avi">
</embed>
</object>

2.mpg格式

<object classid="clsid:05589FA1-C356-11CE-BF01-00AA0055595A" id="ActiveMovie1"
width="239" height="250">
<param name="Appearance" value="0">
<param name="AutoStart" value="-1">
<param name="AllowChangeDisplayMode" value="-1">
<param name="AllowHideDisplay" value="0">
<param name="AllowHideControls" value="-1">
<param name="AutoRewind" value="-1">
<param name="Balance" value="0">
<param name="CurrentPosition" value="0">
<param name="DisplayBackColor" value="0">
<param name="DisplayForeColor" value="16777215">
<param name="DisplayMode" value="0">
<param name="Enabled" value="-1">
<param name="EnableContextMenu" value="-1">
<param name="EnablePositionControls" value="-1">
<param name="EnableSelectionControls" value="0">
<param name="EnableTracker" value="-1">
<param name="Filename" value="../../../mpeg/halali.mpg" valuetype="ref">
<param name="FullScreenMode" value="0">
<param name="MovieWindowSize" value="0">
<param name="PlayCount" value="1">
<param name="Rate" value="1">
<param name="SelectionStart" value="-1">
<param name="SelectionEnd" value="-1">
<param name="ShowControls" value="-1">
<param name="ShowDisplay" value="-1">
<param name="ShowPositionControls" value="0">
<param name="ShowTracker" value="-1">

<param name="Volume" value="-480">
</object>

 

3.smi格式

 

<OBJECT id=RVOCX classid=clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA width=240
height=180>
<param name="_ExtentX" value="6350">
<param name="_ExtentY" value="4763">
<param name="AUTOSTART" value="-1">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="-1">
<param name="SRC" value="rm.rm">
<param name="CONTROLS" value="ImageWindow">
<param name="CONSOLE" value="console1">
<param name="LOOP" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000"><embed src="real.smi"
type="audio/x-pn-realaudio-plugin" console="Console1" controls="ImageWindow"
height="180" width="240" autostart="true"></OBJECT>

 

4.rm格式

<OBJECT ID=video1 CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"
HEIGHT=288 WIDTH=352>

<param name="_ExtentX" value="9313">
<param name="_ExtentY" value="7620">
<param name="AUTOSTART" value="0">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="0">
<param name="SRC" value="rtsp://203.207.131.35/vod/dawan-a.rm";;>
<param name="CONTROLS" value="ImageWindow">
<param name="CONSOLE" value="Clip1">
<param name="LOOP" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000"><embed SRC
type="audio/x-pn-realaudio-plugin" CONSOLE="Clip1" CONTROLS="ImageWindow"

 

HEIGHT="288" WIDTH="352" AUTOSTART="false">

</OBJECT>

 

5.wmv格式

 

<object id="NSPlay" width=200 height=180
classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab
#Version=6,4,5,715"
standby="Loading Microsoft Windows Media Player components…"
type="application/x-oleobject" align="right" hspace="5">
<!– ASX File Name –>
<param name="AutoRewind" value=1>
<param name="FileName" value="xxxxxx.wmv">
<!– Display Controls –>

 

<param name="ShowControls" value="1">
<!– Display Position Controls –>这个参数是用来决定是否显示播放进度条的控制的

 

<param name="ShowPositionControls" value="0">
<!– Display Audio Controls –>这个参数是用来定义是否显示音量控制按钮的

<param name="ShowAudioControls" value="1">
<!– Display Tracker Controls –>这个参数是用来定义是否可以控制声道的

<param name="ShowTracker" value="0">
<!– Show Display –>

<param name="ShowDisplay" value="0">
<!– Display Status Bar –>这个参数是用来定义是否显示播放状态栏的

 

<param name="ShowStatusBar" value="0">
<!– Diplay Go To Bar –>

<param name="ShowGotoBar" value="0">
<!– Display Controls –>这个参数是用来定义是否显示控制面板的

 

<param name="ShowCaptioning" value="0">
<!– Player Autostart –>这个参数是用来定义是否自动播放的

<param name="AutoStart" value=1>
<!– Animation at Start –>

 

<param name="Volume" value="-2500">
<param name="AnimationAtStart" value="0">
<!– Transparent at Start –>这个参数是用来定义视频文件的透明度的

<param name="TransparentAtStart" value="0">
<!– Do not allow a change in display size –>

<param name="AllowChangeDisplaySize" value="0">
<!– Do not allow scanning –>这个参数是用来定义是否允许拖动进度条

<param name="AllowScan" value="0">
<!– Do not show contect menu on right mouse click –>这个参数是用来定义是否允许在视频播放区域点右键

 

<param name="EnableContextMenu" value="0">
<!– Do not allow playback toggling on mouse click –>
<param name="ClickToPlay" value="0">
</object>

]]> http://www.01on.com/a/438.html/feed DW基础教程 (二十三)之发布网站 http://www.01on.com/a/38.html http://www.01on.com/a/38.html#comments Wed, 06 Dec 2006 21:58:30 +0000 admin >]]>  

 

 

 

 

 

 

 

 

 

 

   在发布网站之前先使用Dreamweaver MX 2004 站点管理器对你的网站文件进行检查和整理，这一步很必要。可以找出断掉的链接、错误的代码和未使用的孤立文件等，以便进行纠正和处理。
　　步骤如下：在编辑视图点「站点」菜单＞选“检查站点范围的链接”，弹出“结果”对话框，如下图：

网页制作示图

　　下图是检查器检查出本网站与外部网站的链接的全部信息，对于外部链接，检查器不能判断正确与否，请自行核对。

网页制作示图

　　下图是检查器找出的孤立文件，这些文件您的网页没有使用，但是仍在你的网站文件夹里存放，上传后它会占据有效空间，应该把它清除。清除办法是：先选中文件，点Delete键，确定。这些文件就放在“回收站”。

网页制作示图

　　如果不想删除这些文件，点网页制作示图 保存报告按钮（上图所示），在弹出的对话框中您给报告文件一个保存路径和文件名即可。该报告文件为一个检查结果列表。你可以参照此表，进行处理。

　　纠正和整理之后，您的网站就可以发布了。

    【发布站点操作】

　　如果您是第一次上传文件，您的远程 Web 服务器根文件夹是空文件夹时按以下操作进行。如果不是空文件夹，另行操作附后。

　　服务器根文件夹是空文件夹时，连接到远程站点，请执行以下操作：

　　在 Dreamweaver MX 2004中，选择“站点”>“管理站点”。管理站点对话框中“dwmx2004”是在本教程第5页设置的，如果想回忆一下，请查看“设置站点”。

网页制作示图

　　选择一个站点（即本地根文件夹），然后单击“编辑”。

网页制作示图

　　单击对话框顶部的“基本”选项卡。在前面“设置站点”时，已填写了“基本”选项卡中的前几个步骤，因此单击几次“下一步”，直到向导顶部高亮显示“共享文件”步骤。如下图：

网页制作示图

]]> http://www.01on.com/a/38.html/feed DW基础教程 (二十二)之行为事件 http://www.01on.com/a/37.html http://www.01on.com/a/37.html#comments Wed, 06 Dec 2006 21:56:53 +0000 admin >]]>  

 

 

 

 

 

 

 

  行为是实现网页上交互的一种捷径，Dreamweaver MX 2004 行为将 javascript 代码放置在文档中，以允许访问者与 Web 页进行交互，从而以多种方式更改页面动作或执行某些任务。行为是事件和由该事件触发的动作的组合。

　　下面我们来学习行为的用法。现在，举个例子加以说明。看下图，光标移到图片上面。在它的右侧即显示一段其它内容（动画）。请您用鼠标测试，然后，我们来分析一下这个过程。

网页制作示图

网页制作示图 网页制作示图 网页制作示图 网页制作示图 网页制作示图 网页制作示图

    请您操作鼠标在花上移入移出
    这是两个行为：行为一：移入+显示；行为二：移出+隐藏。
    事件是：鼠标移入和移出。动作是：显示和隐藏。
　　具体操作如下：

　　1、 在页面中插入一张图片，本例为菊花图片。

　　2、 在页面中插入一个层，贴入几个动画小人。如下图：

网页制作示图

　　在层面板中，将该层设置成为隐藏。打开页面的时候不显示。层面板状态，如下图：

网页制作示图
　　3、 单击图片，打开行为面板（「窗口」菜单＞行为）。在行为面板按“+”号，在弹出菜单中选中显示-隐藏层，如下图：
网页制作示图  

系统弹出显示－隐藏层对话框。单击该层，然后单击“隐藏”按钮。确定。
网页制作示图
　　打开“行为”面板，如下图：
网页制作示图
　 4、 我们可以在面板中看到事件和行为。需进一步对事件进行设置。单击“onLoad”，在下拉菜单中选择“<A>onMouseOut”，如下图：
网页制作示图
　4、上述方法是鼠标移出事件行为的设置，重复以上方法再对鼠标移上事件行为进行设置，把显示－隐藏层设为（显示），如下图：
网页制作示图
　　行为事件设置，如下图：
网页制作示图
　　设置后的“行为”面板最终结果，如下图：
网页制作示图
　　5、 保存页面，预览网页。可以看到光标移动到菊花图片上就出现右侧的内容。

　　下面给出一些常见事件的一些解释

　　onClick 单击

　　onDbclick 双击

　　onKeypress按键

　　onMouseDown鼠标按下

　　onMouseOut鼠标移出

　　onMouseOver鼠标移上

　　onMouseUp鼠标抬起。

　　行为是一个很有用的交互手段。由于行为的门类繁多，也较复杂。

 

 

]]> http://www.01on.com/a/37.html/feed DW基础教程 (二十一)之层及应用 http://www.01on.com/a/36.html http://www.01on.com/a/36.html#comments Wed, 06 Dec 2006 21:53:41 +0000 admin >]]>  

 

 

 

 

 

 

 

   层（Layer）是一种 HTML 页面元素，您可以将它定位在页面上的任意位置。层可以包含文本、图像或其它 HTML 文档。层的出现使网页从二维平面拓展到三维。可以使页面上元素进行重叠和复杂的布局。首先，请看下图：

网页制作示图

　　我们首先来做一个层

　　1、 在「窗口」菜单＞选“层”，或点「插入」菜单＞布局对象＞选“层”。

　　2、 在页面中显示一个层。

　　3、 通过周围的黑色调整柄拖动控制层的大小

　　4、 拖动层左上角的选择柄可以移动层的位置。

　　5、 单击层标记可以选中一个层。

　　6、 在层中可以插入其他任何元素包括图片文字链接表格等。

　　一个页面中可以画出很多的层，这些层都会列在层面板中。层之间也可以相互重叠。层面板可以通过菜单「窗口」菜单＞选“层”打开。

网页制作示图

　　这里我们需要对几个概念进行解释。层有隐藏和显示的属性。这是层的一个重要属性和以后说到的行为相结合就变成了重要的参数。单击层面板列表的左边，可以打开关闭眼睛。眼睛挣开和关闭表示层的显示和隐藏。

　　层还有一个概念就是层数，层数决定了重叠时哪个层在上面哪个层在下面。　比如层数为２的层在层数为１的层的上面。改变层数就可以改变层的重叠顺序。

　　层面板上面还有一个参数就是防止层重叠。一旦选中，页面中层就无法重叠了。　

　　层还有一种父子关系也就是隶属关系。在层面板中是这样表示的。

网页制作示图

　　图中Layer2挂在Layer1的下面。Layer1为父层，Layer2为子层。在页面中拖动Layer1，Layer2也跟着动起来。因为他们已经链在一起了，并且Layer2隶属于Layer1。父层移动会影响到子层。移动layer2层，Layer1层不动。也就是子层不会影响到父层。

　　要建立这样的一种隶属关系方法很简单。在层面板中按Ctrl键将子层拖拽到父层即可。

　　［层和表格之间转换］

　　由于层在网页布局上非常方便，所以，一些人可能不喜欢使用表格或“布局”模式来创建自己的页面，而是喜欢通过层来进行设计。Dreamweaver MX 2004可以使用层来创建自己的布局，然后将它们转换为表格。

　　 在转换为表格之前，请确保层没有重叠。请执行以下操作：选择“修改”＞“转换”＞“层到表格”。即可显示“转换层为表格”对话框。

网页制作示图

  • 选择所需的选项。单击“确定”。

        若要将表转换为层，请选择“修改”＞“转换”＞“表格到层”。即可显示“转换表格为层。对话框。

    网页制作示图

        选择所需的选项。单击“确定”。

        层及应用我们就简单介绍到这里。

    • ]]>     http://www.01on.com/a/36.html/feed     DW基础教程 (二十)之应用模板 http://www.01on.com/a/35.html http://www.01on.com/a/35.html#comments Wed, 06 Dec 2006 21:52:29 +0000 admin >]]>  

     

     

     

     

     

     

     

       为了简化制作过程。常常采用先制作出页面，再应用模板的方法。

        简明步骤：打开一个有内容的页面→打开资源面板→点击模板按钮→选择一个模板→点击应用按钮→指定可编辑区域→确定。

    1.打开一个填充了内容的网页。

    网页制作示图

     

    2.打开资源面板，点击“模板”按钮，打开模板类别。

    网页制作示图

     

    3.选择一个模板，点击应用按钮。

    网页制作示图

     

    4.将内容移到新区域，按“确定”按钮

    网页制作示图

     

    5.一个应用模板的页面就做好了。

    网页制作示图

    ]]>     http://www.01on.com/a/35.html/feed     DW基础教程 (十九)之创建模板 http://www.01on.com/a/34.html http://www.01on.com/a/34.html#comments Wed, 06 Dec 2006 21:51:14 +0000 admin >]]>  

     

     

     

     

     

     

     

     

    当需要制作大量布局基本一致的网页时，使用模板是最好的方法。

    本文介绍的是基于一个网页创建模板的方法。

    简明步骤：打开一个已经存在的网页→另存为模板→新建可编辑区域→保存。

    打开示例站点中已经建好的index.htm文件，打开“文件”，点击“另存为模板”。

    网页制作示图

    选择模板存放的站点，在“另存为”中为模板输入一个唯一的名称，单击保存按钮。

     

    网页制作示图

     

    在“插入栏”选择“模板”，然后单击“可编辑区域”。

    网页制作示图

     

    在“名称”文本框中为该区域输入唯一名称。

     

    网页制作示图

     

    建好的模板如下图。

    网页制作示图

     

    重复这个过程。可以再做一些“可编辑区域”。

    网页制作示图

     

    打开“文件”菜单，单击“保存”。一个模板就做好了。

    网页制作示图

     

    ]]>     http://www.01on.com/a/34.html/feed     DW基础教程 (十八)之操作框架 http://www.01on.com/a/33.html http://www.01on.com/a/33.html#comments Wed, 06 Dec 2006 21:49:35 +0000 admin >]]>  

     

     

     

     

     

     

     

       本文介绍操作框架的一些方面：拆分框架，查看和设置框架集属性，设置链接的目标框架。

    拆分框架
    1.在框架页面中，将插入点放在边框上，出现双向箭头。

    网页制作示图

    2.拖动边框，产生一个新的框架文件。
    网页制作示图

    3.在属性面板上，为新框架命名，并且点击“浏览文件”，选择一个文件作为框架的“源文件”。
    网页制作示图

    4.选择“文件”>“保存全部”。
    注：要使用不在“设计”视图边缘的框架边框拆分一个框架，在按住 Alt 键的同时拖动框架边框。

     

    查看和设置框架集属性

    选择“窗口”>“其他”>“框架”,打开“框架”面板。
    在“框架”面板中单击环绕框架集的边框，选中框架集。
    在属性面板上，选中框架区，然后修改框架集属性。
    使用类似的方法修改框架文件的属性。

    网页制作示图

     


    设置链接的目标框架

    在框架页面中选择一个链接，在“目标”弹出式菜单中，选择链接的文档应在其中显示的框架或窗口。
    _blank 在新的浏览器窗口中打开链接的文档，同时保持当前窗口不变。
    _parent 在显示链接的框架的父框架集中打开链接的文档，同时替换整个框架集。
    _self 在当前框架中打开链接，同时替换该框架中的内容。
    _top 在当前浏览器窗口中打开链接的文档，同时替换所有框架。

    如果链接需要在框架页之外打开，使用 target="_top" 或 target="_blank"。

    网页制作示图

    ]]>     http://www.01on.com/a/33.html/feed     DW基础教程 (十七)之添加背景音乐 http://www.01on.com/a/32.html http://www.01on.com/a/32.html#comments Wed, 06 Dec 2006 21:48:17 +0000 admin >]]>  

     

     

     

     

     

     

     

     

    1. 打开一个网页文档，在文档左下角的“标签选择器”中选择“ body ”标签。

     

    网页制作示图

     

    2. 打开行为面板，点击“＋”按钮添加行为。

     

    网页制作示图

     

    3. 选择“播放声音”。

     

    网页制作示图

     

    4. 选择声音文件。一个网页的背景音乐就添加好了。

     

    网页制作示图

     

    如果要修改背景音乐属性

    1. 在文档中选择背景音乐的图标。

     

    网页制作示图

     

    2. 在属性检查器中，点击“参数”按钮。

     

    网页制作示图

     

    3. 修改参数。

     

    网页制作示图

     

    ]]>     http://www.01on.com/a/32.html/feed     DW基础教程 (十六)之弹出窗口 http://www.01on.com/a/31.html http://www.01on.com/a/31.html#comments Wed, 06 Dec 2006 21:47:05 +0000 admin >]]>  

     

     

     

     

     

     

     

     

        进入 163.com 首页的时候，就会弹出小窗口。本文介绍这种弹出窗口的制作方法。

    准备小窗口页面：

    1. 打开一个页面，设置页面属性。左边界，顶部边界为 0 ，在标题处输入标题名称。

     

    网页制作示图

     

    2. 在页面中插入图片。也可以是文字， Flash 动画等。小窗口页面就准备好了。

     

    网页制作示图

     

    给一个页面添加弹出小窗口：

    1. 打开需要添加弹出小窗口页面，例如一个网站的首页，在标签选择器中选择“ body ”标签。

     

    网页制作示图

     

    2. 打开行为面板，点击“ + ”按钮添加行为。

     

    网页制作示图

     

    3. 选择“打开浏览器窗口”。

     

    网页制作示图

     

    4. 在要显示的 URL 处，选择弹出小窗口页面文件。设置弹出小窗口属性。

     

    网页制作示图

     

    5. 按 F12 ，在浏览器中发布的效果如下图。

     

    网页制作示图

     

    ]]>     http://www.01on.com/a/31.html/feed     DW基础教程 (十五)之Dreamweaver的插件 http://www.01on.com/a/30.html http://www.01on.com/a/30.html#comments Wed, 06 Dec 2006 21:45:30 +0000 admin >]]>  

     

     

     

     

     

     

     

       使用Macromedia 功能扩展管理器，可以方便的在Macromedia 应用程序中安装和删除功能扩展。

        在这里想提一下，功能扩展管理器有时会因为莫名其妙的原因损坏。这种情况，重新安装功能扩展管理器就可以了。第一次安装和重新安装方法相同。

    网页制作示图

     

    在Macromedia安装软件目录下，双击功能扩展管理器安装图标。

    网页制作示图

     

    完成功能扩展管理器的安装。

    网页制作示图

     

    在扩展管理器中点击“安装新扩展”按钮。

    网页制作示图

     

    选择并且安装插件。

    网页制作示图

     

    在Dreamweaver中选择插件。实例中是FlashImage插件。

    网页制作示图

     

    设置插件。

    网页制作示图

     

    Macromedia网站也有很多插件下载。
    http://www.macromedia.com

    ]]>     http://www.01on.com/a/30.html/feed