电话

0411-31978321

dreamweaver制作简单网页步骤详解?(新手也能快速学会)

标签: 2025-10-22 

今天突发奇想试试用老古董Dreamweaver做网页,毕竟刚入门的表弟说想学点基础的。翻出十年前买的安装包折腾半天,居然还能用!顺手把摸索过程记下来,说不定能帮到同样想入门的伙计们。

开搞前的准备

电脑里压根没现成素材,先瞎拍了几张家门口月季花的照片。又从硬盘角落扒拉出个过期的旅游攻略文档,拆出几段文字当临时内容。翻箱倒柜找到个古早霓虹渐变色截图当背景图——凑合用!

从零搭建页面骨架

1. 打开软件直接点左上角新建HTML文件,跳出来一堆看不懂的英文选项。不管三七二十一直接点确定,居然蹦出个像PS的界面,右边还带个写满天书的文本框。

2. 鼠标在空白处戳了半天没反应,发现左上角必须点"设计视图"才能编辑。切换到设计模式后终于能打字了,吭哧吭哧把旅游文案粘贴进去,结果所有段落挤成一大坨。

3. 想起来得加分段标签,按网上教程点开插入菜单里的p标签,结果变成每段文字都裹了个灰色框。想删掉这些框发现删不动,后来发现得在左下角的标签选择器右键删除,这操作藏得够深!

塞图片和调颜色

4. 打算在文字中间插月季花图,光标定位后直接拖图片进窗口。原图太大撑爆页面,还得在属性面板手动改尺寸,来回调了七八次才顺眼。

5. 看纯白背景太寡淡,点开页面属性想加渐变色。结果背景图选项死活不认JPG格式,折腾半小时才发现必须用gif或者png。临时用在线工具转格式才算解决。

表格救了大命

6. 想做个简易导航栏,直接敲了"首页攻略照片"这几个字,但死活没法居中对齐。突然灵光一闪点开表格功能,插入1行3列的表格,把文字分别塞进三个格子。

  • 表格边框设成0隐藏黑线
  • 每个格子按Ctrl+Alt+T调居中
  • 整张表用鼠标拖到页面顶部

7. 给表格加底色时又栽跟头:选好蓝色后死活没反应。结果发现要选中整个表格格子才能在属性面板改颜色,漏选半格就只能改半个单元格。

收尾的教训

8. 好不容易做完点F12预览,发现电脑自带的IE浏览器排版全乱套。换火狐和Chrome才正常显示,果断让表弟远离IE。

9. 存文件时闹乌龙:默认保存在C盘某个神秘角落,找了半天才发现。在文件菜单点"另存为",专门建了个"网页实验"文件夹才找回来。

试下来感觉这老软件虽然操作反人类,但可视化界面对新手的意义挺大。刚完成的破网页丑是丑了点,但表弟自己试着点了点表格链接(虽然根本没做跳转),居然兴奋地说"原来网页是这么做出来的"。对了,做完千万别用DW自带的网上传文件功能,听说容易泄露密码——咱还是老实手动传FTP!