dreamweaver网页设计与制作

1. 第一步 建立本地站点
   打开 Dreamweaver，在菜单里找到「站点」相关命令，选择「新建站点」。在站点设置里把「站点名称」填成你项目的名字，把「本地站点文件夹」指向电脑上存放网页文件的目录，例如 D 盘下的一个项目文件夹。这一步是让 Dreamweaver 知道你的网页文件放在哪里，后面新建文件、保存、上传都会以这个文件夹为根。站点名和文件夹名建议用英文或拼音，避免中文路径在某些服务器上出问题。设置完成后保存，左侧的「文件」面板就会显示这个站点的目录结构。
2. 第二步 新建并保存 HTML 页面
   在菜单里选择「文件」下的「新建」，在弹出的「新建文档」对话框里，文档类型选 HTML，然后确定。此时编辑区会出现一个空白页面。先按 Ctrl+S 保存，保存位置选在刚才建立的本地站点文件夹内，文件名写成 index.html，这个文件通常作为网站首页。保存后注意「文件」面板里会出现这个文件，说明它已经在站点管理范围内。之后每做一个新页面，都重复新建加保存到同一文件夹，页面之间的相对链接才不会断。
3. 第三步 切换视图写内容与结构
   Dreamweaver 顶部一般有「代码」「拆分」「设计」三种视图切换按钮。想快速排版文字和图片，可以用「设计」视图，直接像编辑文档一样输入内容；想看或改 HTML 标签，切到「代码」视图；想一边看效果一边改代码，用「拆分」视图。插入图片、链接、表格时，可以通过「插入」面板或菜单里的「插入」命令完成，插入图片时注意路径要指向站点文件夹内的图片，不要用桌面上的临时文件。保存后可以按 F12 或通过「在浏览器中预览」查看实际效果。
4. 第四步 用 CSS 控制样式与布局
   在「CSS 设计器」面板里可以新建样式规则，把它附加到当前页面或外部样式表。常见做法是新建一个外部 CSS 文件放在站点内，然后在页面的 head 区域链接它。选择器、属性、值这些内容建议在「CSS 设计器」里逐项核对后再写入，不熟悉时不要直接凭记忆敲。布局上可以用盒子模型思路处理 div 的宽高、内外边距，再用浮动或弹性布局排列栏目。改完样式后回到浏览器预览，确认不同页面都引用了同一个样式表，风格才会统一。
5. 第五步 预览检查并上传发布
   全部页面做完后，用浏览器逐个打开检查链接能不能跳转、图片是否显示、文字有没有错位。确认无误后，在「文件」面板里选中要发布的文件或整个站点，使用「上传」相关命令，把文件传到已经配置好的远程服务器。如果还没配置远程信息，需要先在站点设置里填写服务器地址、目录和登录方式，这一步的具体填写项请以你拿到的服务器信息为准。上传完成后用域名访问首页，核对线上效果与本地预览是否一致。

软件页面：Dreamweaver。