建一个网站 http://blog.china.com:80/u/080501/138592/ 学习建站,共同来学习吧 小涵女 小涵女 制作前的准备工作——定义本地站点 http://blog.china.com:80/u/080501/138592/200805/2504417.html <![CDATA[ <DIV>千里之行，始于足下。使用Dreamweaver制作网页的第一步就是在自己的硬盘上建立一个本地站点。本地站点指的是一个命名的文件夹，保存所要用到的全部文件。当用户在设计的网页中插入了其它元素（如文字、图片）时，Dreamweaver会提示将这个元素复制到本地站点所对应的目录下，这样一来就不会造成图片的丢失，也是为了更好地利用站点窗口对站点文件进行管理。 <P>　　定义的方法</P> <P><BR>　　方法一：在站点窗口的下拉菜单选择最后一项定义站点，如下图。</P> <P><IMG height=266 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/4.gif" width=400></P> <P>此时会弹出一个新的对话框，点击“新建(N)”按钮是定义一个新网站，如果日后需要对旧有网站重新定义，可以在左边的网站列表中选中你需要重新定义的网站，然后点击“编辑（E）”按钮便可。</P> <P><IMG height=202 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/5.jpg" width=283></P> <P>方法二：选择命令菜单 站点&gt; 新建站点选项。</P> <P><BR>　　基本设置</P> <P><BR>　　在接着看到的对话框中，要进行以下三步简单的设置：</P> <P><IMG height=313 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/6.gif" width=400></P></DIV>]]> 星期四, 01 五月 2008 16:00:18 GMT http://blog.china.com:80/u/080501/138592/200805/2504417.html 2008-05-01T16:00:18Z Dreamweaver4.0工作界面 http://blog.china.com:80/u/080501/138592/200805/2504413.html <![CDATA[ <DIV>正式开始使用Dreamweaver之前我们先来熟悉一下Dreamweaver的操作界面。　<BR>一、工具条：这是Dreamweaver4.0新增加的功能。启动Dreamweaver 4最先看到的就是这个工具条。可以通过菜单View--〉Toolbar来显示和关闭工具栏</DIV> <DIV><IMG height=107 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/gjl.jpg" width=535></DIV> <DIV> <P>1、 代码视图:按下此按钮以后就可以直接编辑和察看HTML源代码。这个相当于以前版本的HTML代码编辑窗口。2、代码与设计视图。按下这个按钮以后就可以同屏显示源代码和页面的效果。这个对于网页制作者来说是极其方便的。可以一边修改代码。一边就可以看到设计的改变。而无需再在窗口间来回切换。<BR>3、设计视图：就是以前的Dreamweaver网页编辑窗口<BR>4、、 网页标题（Title）。<BR>5 、 文件状态（File Status）。文件状态按钮用来修改文件的状态。<BR>6、 浏览器中预览/调试（Preview/Debug in browser）。在浏览器中预览页面和在浏览器中调试Javascript脚本。<BR>7、 刷新（refresh）。可以刷新文件列表和页面。<BR>8、 参考书（Reference）。这是Dreamweaver为专业网页设计师提供的一个详细的参考手册（包括HTML、CSS、Javascript）。<BR>9、 代码导航：点击代码导航按钮来移动文档里定义的JavaScript 函数，<BR>10、 显示选项（View Options）。<BR>（1）代码显示模式下的选项菜单按钮，可以选择Word Wrap（自动换行）, Line Numbers（行数）, Highlight Invalid HTML（高亮HTML中的错误）, Syntax Coloring（显示语法的颜色）, Auto Indent（自动缩进）和顶端的Design View（设计显示）。<BR>（2）点击设计显示模式下的选项菜单按钮，可以隐藏所有的可视化帮助或锁定可视化帮助，如表格边框，层边框，帧框架边框，图片映射，不可见元素，表头，标尺，网格，以及图片的轨迹。 <BR>二、文档窗口<BR>　文档窗口是编辑网页的区域，其内容与在浏览器中的运行结果相似但又有所差异。窗口上方标题栏、菜单栏<BR>　下方的状态栏中有一些标记如：文档大小、下载时间 </P> <P><IMG height=39 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/ztl.jpg" width=326></P> <P>通过这些标记可以快速选择网页中的对象，状态栏的右边有一些图标（小型启动面板），单击图标可以打开相应的操作面板或窗口。</P></DIV>]]> 星期四, 01 五月 2008 15:57:53 GMT http://blog.china.com:80/u/080501/138592/200805/2504413.html 2008-05-01T15:57:53Z 初步认识 Dreamweaver MX http://blog.china.com:80/u/080501/138592/200805/2504407.html <![CDATA[ <P><FONT class=fl01 size=4>Dreamweaver的启动</FONT><BR>　　<SPAN class=fl01>Dreamweaver的安装过程非常简单，一但成功安装后，就可以在开始菜单找到Dreamweaver的选项，当然你可以把快捷方式放在桌面，然后双击启动。</SPAN></P> <P><SPAN class=fl01>　　DreamweaverMX的工作界面有两种：DreamweaverMX界面和Dreamweaver4。0界面，两者外观不同，可在参数选项中切换工作界面。 </SPAN></P> <P class=fl01>Dreamweaver的各个窗口</P> <P class=fl01>第一次启动Dreamweaver，首先看到的是Dreamweaver的编辑窗口，千万别给上面密密麻麻的浮动窗口吓倒，其实常用的，就以下几个：</P> <P></P> <P><SPAN class=fl01>　　① 主菜单：在这里可以找到编辑窗口的的绝大部分功能；<BR>　　② 工具栏：是Dreamweaver4的新增功能；<BR>　　③ 对象面板（Objects）：在网页编辑的过程中，通过单击对象面板的按钮来为网页添加相应的元素，如图片、表格、层、Flash。我们称这些元素为为对象。单击对象面板上的向下箭头，能插入其他类型的对象，如特殊字符（Characters）、表单（Froms）等。</SPAN></P> <P align=center><SPAN class=fl01><IMG height=250 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/04.gif" width=48></SPAN></P> <P align=left><SPAN class=fl01>④ 属性面板：用于显示所选中的网页元素的属性，并可在属性面板上修改。选择不同的网页元素，属性面板所显示的内容也有所不同，例如图片和表格所显示的属性是不一样的。此外，点击属性面板右下角的小三角可以根据使用的需要，缩小或展开属性面板，建议一般情况下都设置为展开模式。<BR>　　⑤ 面板组（又称可停靠浮动面板）：Dreamweaver 还有很多很多其他的浮动面板，我们可以根据自己的喜好，将不同的浮动面板重新组合，这就是所谓的面板组。在Photoshop中，也有类似的概念。<BR>　　⑥ 快速启动栏（又称启动面板）：用于显示或隐藏响应的浮动面板。启动面板与右下角的微型启动栏 <IMG height=14 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/05.gif" width=137>一一对应；其中<IMG height=12 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/07.gif" width=13></SPAN></P> <P align=left><SPAN class=fl01>是切换到站点管理器， <IMG height=12 src="http://www.qdgx.qdedu.net/wsjx/dw/photo/08.gif" width=16>是切换到行为面板， 是查看网页源代码。<BR>　　⑦ 编辑区域：以"所见即所得"的方式显示被编辑网页内容:</P> <P class=fl01>　　【提示1】如果屏幕上的浮动面板位置过于凌乱，甚至超出了桌面范围而不便操作的时候（在改变了显示器的分辨率后尤其容易出现这种情况），可以选取主菜单中的"Window &gt; Arrange Panels"自动重排浮动面板。</P> <P class=fl01>　　【提示2】以下是几个常用的浮动面板的快速打开和关闭的热键，好好记住，因为将会再制作过程中被频繁地使用：</P> <P class=fl01><FONT color=#cc3300><FONT color=#cc0000>属性面板(Properties)：Crtl+F3</FONT></FONT></P> <P class=fl01><FONT color=#cc3300><FONT color=#cc0000>样式面板(CSS Styles)：Shift+F11</FONT></FONT></P> <P class=fl01><FONT color=#cc3300><FONT color=#cc0000>行为面板(Behaviors)：Shift+F3</FONT></FONT></P> <P class=fl01><FONT color=#cc3300><FONT color=#cc0000>对象面板(Objects)：Crtl+F2 </FONT></FONT></P> <P class=fl01><FONT color=#cc0000>启动面板（Launcher）</FONT></P> <P class=fl01><FONT color=#cc0000>站点管理窗口（Site Files）</FONT></P> <P class=fl01><FONT color=#cc0000>时间线面板（Timelines）</FONT></P> <P class=fl01><FONT color=#cc0000>HTML源码面板（Code Inspector）</FONT></P> <P class=fl01><FONT color=#cc0000>其它面板<BR>　站点地图管理器（Site Map）<BR>　资源面板（Assets）<BR>　图层面板（Layers）<BR>　框架面板（Frames）<BR>　CSS样式面板(CSS Styles)<BR>　模板面板(Templates)<BR>　历史面板(History)<BR>　库面板（Library）<BR>　HTML风格面板（HTML Styles）<BR>　参考面板（Reference）</FONT></P></SPAN>]]> 星期四, 01 五月 2008 15:55:55 GMT http://blog.china.com:80/u/080501/138592/200805/2504407.html 2008-05-01T15:55:55Z Dreamweaver　ＭＸ简介 http://blog.china.com:80/u/080501/138592/200805/2504391.html <![CDATA[ <DIV>Dreamweaver是美国MACROMEDIA公司开发的集网页制作和网站管理于一身的所见即所得网页编辑器,被世人称为DREAMTEAM(梦之队)三剑客之一，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。 <P>　　目前越来越多的人加入到Dreamwver的学习中来。但对初学者来说，Dreamwver不如Frontpage那样易于上手。我们的学习内容会由浅入深，循序渐进，希望引领你踏上愉快的Dreamweaver之旅……</P> <P>一、 DreamweaverMX能做什么<BR><BR>DreamweaverMX是专业网页设计、网站管理、网页可视化编辑的软件。用它可以制作出非常好的站点，可以快速提升网页制作效率。与flash、fireworks合称为梦幻组合。<BR>二、Dreamweaver功能：<BR><BR>1、图层的使用。利用图层可准确地定位，图层可单独放置在网页的任一地方，可以重叠、移动、变化、隐藏、显示。利用层产生三维排版。<BR>2、强大的动态页面支持。Dreamweaver的Behavior（行为动作）和timeline（等时线）功能，例如移动图、新窗口弹出、浏览器自动检测等。能在使用者不懂java script的情况下，往网页中加入丰富的动态效果。<BR>3、可安装各种插件，使其功能更强大。使用者若有兴趣，还可自己给Dreamweaver制作插件，使Dreamweaver更适应个人的需求。<BR>4、Dreamweaver提供的历史面板、html样式、模版、库等功能避免了重复劳动，使用者不必重复输入相同的内容、格式。<BR>5、Dreamweaver能直接往页面中插入Flash、Shockwave等插件，经过设置后还可直接调用相应的软件对这些插件进行编辑。最后，Dreamweaver与Fireworks集成紧密，可直接调用Fireworks对页面的图象进行修改、优化。<BR></P> <P>DreamweaverMX新功能：</P> <P><BR>1、 统一的工作区：<BR>2、 更加强大的模板<BR>3、 广泛的代码库<BR>4、 新服务器技术支持<BR>5、 XML和WEB标准支持<BR>6、 对CSS2的支持<BR>7、 高性能编码的支持<BR></P></DIV>]]> 星期四, 01 五月 2008 15:51:12 GMT http://blog.china.com:80/u/080501/138592/200805/2504391.html 2008-05-01T15:51:12Z 欢迎使用中华网BLOG http://blog.china.com:80/u/080501/138592/200805/2504333.html <![CDATA[ 发博客，交博友，从现在开始你的博客生涯吧。^_^]]> 星期四, 01 五月 2008 15:36:20 GMT http://blog.china.com:80/u/080501/138592/200805/2504333.html 2008-05-01T15:36:20Z