这份教程将从基础概念开始，逐步带你搭建一个功能完整的动态网站，无论你是 Dreamweaver 的新手，还是对 PHP 和 MySQL 不太熟悉,都可以跟着这份教程学习。
（图片来源网络，侵删）
重要前提：现代 Web 开发与 Dreamweaver 的定位
在开始之前,有一个非常重要的点需要说明：
- Dreamweaver 的角色：现代 Web 开发更倾向于使用 VS Code、Sublime Text 等轻量级、高度可定制的代码编辑器，这些工具配合强大的插件（如 PHP Intelephense, Prettier, Live Server）能提供更高效的开发体验。
- Dreamweaver 的优势：Dreamweaver 的核心优势在于其 可视化设计 和 对初学者的友好性，它提供了“实时视图”（Live View）和“实时代码”（Live Code）功能，让你可以在不刷新页面的情况下看到代码修改的效果，这对于理解 HTML、CSS 和 PHP 的交互非常有帮助，它还内置了服务器行为,可以快速生成常用的数据库操作代码。
这份教程非常适合 初学者 或 需要快速原型开发 的设计师，对于专业 PHP 开发者，可能更推荐使用 VS Code，但 Dreamweaver 依然是学习前后端交互原理的绝佳工具。
第一部分：准备工作 - 搭建本地开发环境
在 Dreamweaver 中编写 PHP 代码，你需要一个本地的 Web 服务器环境来解析 PHP 文件。
步骤 1：安装本地服务器环境
推荐使用集成的环境包，它们一键安装,省去手动配置的麻烦。
（图片来源网络，侵删）
-
Windows 用户：推荐 XAMPP 或 WampServer，它们集成了 Apache (Web服务器)、MySQL (数据库) 和 PHP。
- 下载地址：https://www.apachefriends.org/
- 安装：下载后，按照安装向导一步步操作即可，安装过程中，它会自动将 Apache 和 MySQL 设置为 Windows 服务,开机自启。
-
macOS 用户：推荐 MAMP 或 XAMPP for macOS。
- 下载地址：https://www.mamp.info/
- 安装：下载
.dmg文件，拖拽到Applications文件夹即可。
步骤 2：验证环境是否安装成功
- 启动 XAMPP/MAMP 控制面板，确保 Apache 和 MySQL 模块的 Start 按钮是绿色的（表示已启动）。
- 打开你的浏览器，在地址栏输入
http://localhost或http://127.0.0.1。 - 如果看到 XAMPP/MAMP 的欢迎页面，说明你的本地 Web 服务器已经成功运行。
步骤 3：在 Dreamweaver 中设置站点
这是最关键的一步，它告诉 Dreamweaver 你的网站文件存放在哪里,以及如何与本地服务器通信。
- 打开 Dreamweaver。
- 点击菜单栏的 站点 -> 新建站点。
- 在弹出的窗口中，切换到 “服务器” 选项卡。
- 点击 号，添加一个新服务器。
- 服务器名称：任意命名，如
本地 XAMPP 服务器。 - 连接方法：选择 本地/网络。
- 服务器文件夹：点击文件夹图标，选择你的网站根目录，对于 XAMPP，通常是
C:\xampp\htdocs\(Windows) 或/Applications/XAMPP/htdocs/(macOS)。建议在这个目录下新建一个文件夹作为你的项目，my_project。 - Web URL：输入
http://localhost/你的项目文件夹名/，如果你的项目文件夹是my_project，这里就填http://localhost/my_project/。 - 服务器模型：选择 PHP。
- 测试：勾选“测试”选项，然后点击右上角的 “测试” 按钮，如果成功，会弹出“连接成功”的提示。
- 服务器名称：任意命名，如
- 回到“服务器”设置窗口,确保你刚添加的服务器被勾选。
- 切换到 “站点” 选项卡，设置 “站点名称”（与服务器名称一致即可），并 “本地站点文件夹” 选择与“服务器文件夹”相同的路径。
- 点击 “保存”。
你的 Dreamweaver 已经准备好进行 PHP 开发了！
（图片来源网络，侵删）
第二部分：创建你的第一个 PHP 页面
步骤 1：创建 PHP 文件
- 在 Dreamweaver 中，点击 文件 -> 新建。
- 在“新建文档”窗口中，选择 “PHP”，然后点击 “创建”。
- Dreamweaver 会生成一个基本的 PHP 文件模板，包含
<!DOCTYPE html>和<?php ... ?>
步骤 2：编写并运行 PHP 代码
在 <?php ... ?> 标签之间，输入你的 PHP 代码。
示例：显示当前时间
<?php
// 这是一个 PHP 注释
echo "Hello, Dreamweaver!"; // echo 用来输出内容
echo "<br>"; // 换行
echo "当前时间是：" . date("Y-m-d H:i:s"); // 连接字符串并显示时间
?>
运行页面：
- 按快捷键 F12，或者在工具栏点击 “在浏览器中预览” 图标。
- Dreamweaver 会自动使用你配置好的本地服务器 URL 来打开文件，你应该会在浏览器中看到：
Hello, Dreamweaver! 当前时间是：2025-10-27 15:30:00
恭喜！ 你已经成功运行了第一个 PHP 页面。
第三部分：连接数据库 - 创建动态网站核心
一个动态网站的核心是数据库，我们将以一个简单的“文章列表”为例。
步骤 1：创建数据库和表
- 打开浏览器，访问
http://localhost/phpmyadmin，这是 XAMPP 自带的数据库管理工具。 - 在“数据库”选项卡中，创建一个新数据库，命名为
my_blog。 - 在
my_blog数据库中，点击 “新建” 创建一个表。- 表名：
articles - 字段数：4
- 点击 “执行”。
- 表名：
- 定义表的字段：
id(INT, 主键, 自动递增)title(VARCHAR, 255)content(TEXT)created_at(DATETIME)
- 点击 “保存”。
- 切换到 “插入” 选项卡，为
articles表添加几条示例数据。
步骤 2：在 Dreamweaver 中定义数据库连接
- 在 Dreamweaver 中，打开你的 PHP 文件。
- 点击菜单栏的 “站点 -> 数据库”，在右侧会弹出“数据库”面板。
- 点击面板左下角的 号，选择 “MySQL 连接”。
- 在弹出的窗口中填写信息：
- 连接名称：
my_blog_connection(任意命名) - MySQL 服务器：
localhost - 用户名：
root(XAMPP/MAMP 的默认用户名) - 密码：留空 (XAMPP/MAMP 的默认密码为空)
- 数据库：
my_blog
- 连接名称：
- 点击 “测试”，如果成功，会提示“成功连接到数据库”。
- 点击 “确定” 和 “完成”。
你的数据库连接已经定义好了，在“数据库”面板中，你应该能看到你的数据库、表和字段。
步骤 3：显示数据库内容
这是 Dreamweaver 最强大的功能之一：服务器行为。
- 在你的 PHP 文件中，将光标放在
<?php ?>标签之后,你希望显示文章列表的地方。 - 点击菜单栏的 “插入 -> 数据库 -> 动态数据 -> 记录集”。
- 在弹出的“记录集”窗口中设置：
- 名称：
rsArticles(记录集的名称) - 连接：选择你刚刚创建的
my_blog_connection - 表格：选择
articles - 列：选择 (选择所有列)
- 排序：选择
id，顺序为 “降序” (让最新的文章在最上面)
- 名称：
- 点击 “确定”。
Dreamweaver 会自动
