如何改写DW个人网页设计源代码以实现效果？

小聊：DW到底是个啥玩意儿？

完善一下。 说实话，Dreamweaver在前端圈子里算是老牌子了。

哪怕... 哈哈，它不仅能可视化拖拽，还能直接敲代码。

咱就是说想省事儿就用它的设计视图，想精准控制就切到代码视图，深得我心。。

懂的都懂，双模式其实是它的核心优势。

第一步：把源文件拉下来

这东西... 先得有个FTP客户端，比如FlashFXP或者别的。

输入服务器地址、用户名和密码。

登录成功后找到根目录。

把要改的HTML、CSS、JS文件下载到本地。

我深信... 这个过程有点像搬家，文件多的时候会手忙脚乱——不对不对，应该先做好备份再动手。

第二步：打开DW， 准备大改

双击HTML文件，DW会自动切到设计+代码双视图，我可是吃过亏的。。

害，你可以在左侧看到页面结构，在右侧直接编辑源码。

如果你更喜欢轻量编辑器， 也可以用Notepad++或者HBuilder打开同一个文件——别忘了保持编码统一，否则中文会乱码。

第三步：定位目标元素

先用浏览器的审查工具找出你要改的

记下它的class或id名称。

换位思考... 回到DW的代码窗口，用Ctrl+F搜索，一下子定位到对应位置。

如果是模板页面 还可能有之类的包含语句，要进去相应文件继续修改。

第四步：动手

往白了说... 比如想把导航栏从水平变竖直， 只需要把里的顺序调一下再加点CSS属性。

咱就是说 这种改动往往伴随JS交互，需要同步检查事件绑定是否失效。

话虽然是这么说… 别忘了保存后点击DW左下角的“实时预览”，看效果是不是跟预期一样。