1.4.1 设置本地站点位置
首先应该先在硬盘内创建文件夹作为将要建立站点的存 储位置 。
1.4.2 建立Dreamweaver 8本地站点
在Dreamweaver中建立本地站点的方法很多，其中一个 是使用它提供的“新建站点向导”。
1.4.2 建立Dreamweaver 8本地站点
新建站点 ： (1)在D盘新建一个文件夹“Myweb+学号”作为站点文件夹。 (2)在文件夹“Myweb+学号”中再创建Images文件夹作为存放图 片的地方。 (3)单击“站点”—新建—站点，输入站点名称，如：web1，单击 “下一步”。 (4)选择“不使用服务器技术”，单击“下一步”。 (5)选择网页的存储位置为“D:\ Myweb+学号”，单击“下一步”。 (6)在“如何连接远程服务器”中选择“无”，单击“下一步”— “完成”，即可在右边的文件管理器中看见Web1站点。 (7)右键单击“站点—Web1“，选择”新建”—文件，即可建立网站 的第一个网页文件，通常命名为index.html，并作为主页。 (8)保存网页，并按F12预览即可看到效果。
一般来说，一个html文件应具有下面最基本的结构： <html> <head> <title>标题</title> </head> <body> 文件内容 </body> </html>
◎<html>和</html> 表示文件的开始与结束，被放置在整个文件的开始与结束 之处。
◎<head>和</head> 用来标示文件头。在这组标记里我们可以加入<title>和
</title>这组标记。
◎<title>和</title> 用来指定浏览器窗口的标题。
◎<body>和</body>
在这组标记里我们可以加入文件内容。另，我们可以利用<body>做一些设定： 【设定背景颜色】： 其设定方法为<body bgcolor=颜色名称>。 范例： <body bgcolor=yellow> 现在的背景颜色是黄色！ </body> 【设定背景图片】： 其设定方法为<body background=“背景图片路径”> 范例： <body background=“bg02.bmp”> 看看背景图案是否不一样了！注意：仅支持BMP跟gif格式的图片，且图片 bg02.bmp必须跟网页在同一个路径下。
超文本链接
1、由文字链接到别处： 格式：<a href=“链接地址”>文字</a> 如： <a href=“”>广西民族大学</a> 2、由图片链接到别处： 格式：<a href= “链接地址” ><img src=“图片存放位置"></a>
1.2 Dreamweaver 8的操作界面
1.4.3 网站框架和站点文件夹
建立站内文件夹 框架。新建立的 站点可以进行文 件夹的移动、修 改和删除。
Dreamweaver的文字插入
网页各元素的设计 1、文字：直接输入，通过属性设置其大小、颜色、字体、加粗等。 （与Word类似） 如果字体列表中没有想要的字体，则需添加，方法：单击“字 体”—“编辑字体列表”—在“可用字体”中将需要的字体 添加到右边的“选择字体”框中，单击确定，再次单击 “字体”，选择刚添加进来的字体即可。
Dreamweaver的图片插入
图片 2、图片 (1) 为使站点图片管理更规范，初学者最好将要插入的图片先复 制到网站的文件夹images中。，然后再单击“插入”—图调整图形的各种属性。 （3）单击“图像对象”—鼠标经过图像，确定“源图像”和“鼠 标经过图像”，可以插入动态的翻转图像。
浮动面板组
1.2.1 标题栏
1.2.2 菜单栏
1.2.3 插入栏面板
插入栏提供了把特定对象插入到网页中的一种简
易的方法。只要单击面板上的按钮就能把所需的 对象插入到指定的位置，
1.2.4 编辑窗口
1.2.5 文档工具栏
文档工具栏包含了对该网页文件的常用操 作
1.2.6 状态栏
位于文档窗口底部的是状态栏。状态栏由 标签选择器、窗口操作区、窗口大小设定区 、文档网络属性区4个区间组成。
</body>
构成网页的基本元素
1、分段元素与分行元素 html的分段完全依赖于分段元素<P>。回车 不能形成分段，而分行则用<br> 2、居中链接签<center>…</center> 3、字体大小、颜色： <font size=字号 color=颜色>文字</font> 4、横线：hr 线长和线宽用<hr size=n width=n>指定，width是指线长， size 指线宽，单位 是象素 5、空格的表示方法：直接写 。 6、插入图片： <img src=“图片路径”></img>
1.2.1 标题栏 1.2.2 菜单栏 1.2.3 插入栏面板 1.2.4 编辑窗口 1.2.5 文档工具栏 1.2.6 状态栏 1.2.7 属性面板 1.2.8 辅助设计工具
1.2 Dreamweaver 8的操作界面
插入面板栏 插入栏
文档工具栏
菜单栏
文档编辑窗口
标题栏
状态栏
属性面板
网页设计公开课
珠海电大电子商务工作室
邓同学
2015/12/21
网页的基本知识
1、网页制作常用知识简介。 (1)HTML语言的知识 (2)Dreamweaver软件：网页制作中构造框架的主要软件。 (3)Flash软件：动画制作软件。 (4)Photoshop软件：图片设计软件。
一个html文件最基本的结构：
1.2.7 属性面板
属性面板会根据对象的不同来显示相应的 对象属性。
1.2.8 辅助设计工具
标尺
1.2.8 辅助设计工具
辅助线用来辅助定位。
1.2.8 辅助设计工具
网格是一个有用的定位参考工具。
1.3 调整布局
1.3.1 显示和隐藏面板 1.3.2 调整面板布局
1.3.1 显示和隐藏面板
通过选择“窗口”菜单，可以显示 / 关闭各个面板。菜单中面板名称前的 “√”表示该面板已经显示在页面上。
1.3.2 调整面板布局
面板布局同样可以改变。用户可以收藏面 板，使页面编辑区扩大。
1.4 第一个站
1.4.1 设置本地站点位置 1.4.2 建立Dreamweaver 8本地站点 1.4.3 网站框架和站点文件夹 1.4.4 建立网页文件
