Question

dreamweaver显示效果与实际预览的不同

我把那些别人做好的网页模板放到dreamweaver查看，为什么他们做的效果与实际预览效果不同？例如某栏的文字在dreamweaver的时候显示是竖的，但是实际在浏览器预览的时候确实横的，而且有些模块的位置也跟实际浏览器预览的不同，究极为什么会这样，他们当时做的时候是不是也是这样的效果？为什么差别会出现那么大？

大家看下下面两张图，第一张是dreamweaver的效果，第2张是实际预览的效果，为什么dreamweaver显示的那么凌乱，而实际显示的却比较整齐呢？当时这个模板的设计者在设计的时候看到的效果也是这样吗？
我问的是为什么dreamweaver与浏览器显示的不一样，不是问各个浏览器显示不一样的问题，我从把别人做的模板的代码放到dreamweaver里看到的效果究竟是不是他们制作时候的效果（例如第一张图）





Answer 1

在dreamweaver中的页面定位是一个理论上的定位，实际预览时，会因为浏览器的不同（主要是不同浏览器对一些css的属性支持不同，不同的浏览器对像素尺寸处理也不同），显示的效果有所偏差，这很正常。设计者在设计时一般都是先在自己最习惯的浏览器下实现布局，然后才回去考虑其他浏览器的兼容性

Answer 2

楼主，你太高看DW了。我只说3点。

1》看图片，你的DW版本是DW 8吧，那是4、5年前的版本了， DW8 下面是DW cs3 直到现在的DW cs6。DW版本支持的代码和处理某些互联一起的代码时还有误写的代码时，处理不同。

2》每个浏览器对W3C的标准支持程度不同，每个浏览器会自己对元素的显示进行默认设计（例如行高，文字断连，字体等等），所以你画面中的错位是因为默认字体间隔大小不同，列表符号和字体距离的大小不同，标签未正常设置宽高下写了别的属性，而浏览器会默认解决这个问题等多个原因造成的，布局可能是你代码先写右浮动，后写左浮动.左边向下错位，（360浏览器是IE内核）所以在浮动时，IE有个著名的双边距BUG，宽度不够所以会错位。而DW没有错位。反正纠结最后，你需要调的是浏览器的页面效果。

3》DW的预览就是个鸡肋，一般写代码会直接点浏览器预览，不会有谁在意DW预览，那种预览只是徒增烦恼，还有DW并非神器，只能算是入门的好帮手罢了，早日放弃DW吧，推荐sublime text2.

珍重！

追问

现在不是浏览器问题，而是为什么在dw显得比较乱，而浏览器看的时候确实整齐的，当时的设计者设计的时候难道也是设计的时候板式跟我现在拷到自己电脑看的效果一样吗？

这个模板我在IE和火狐预览效果都是一样的，没有任何问题，问题是为什么在dw的时候差别会那么大？

追答

是的。设计师和你的DW上预览的效果都差不多。 我解释一下原因吧。

首先你要知道：一段代码成为一个页面，靠得的浏览器内核去处理这些代码。

下面就是相同的代码DW预览出错了，别的浏览器正常了。那么就是DW的处理代码方面不完全，没有浏览器的处理能力高，至于你问我DW哪方面处理不健全，具体我说不上来了，凭经验是table方面支持度高，div+css方面有大批量的代码处理出错。包括定位，显隐，等一系列除宽高等常用的属性。

这样说，你明白了吧，所以直接无视越过DW预览。只要看浏览器效果就好。
DW只是软件，只不过这个软件有缺陷，你不可能拿DW看每一个网页吧，都是用浏览器啊。

Answer 3

①初学者都会困惑的一个问题。
如果你能理解IE与Firefox、Chrome等浏览器之间也存在许多兼容性问题，许多不同表现的Bug，那你就不会疑惑DW的解析html文档代码时与其他浏览器的差异了。
②每个浏览器都用各自的解析器去解析网页，虽然有逐渐统一的趋势，但由浏览器之战也注定各个浏览器都会保留各自的“特色”，这是生存之道，也是各自性能和解析器的限制。
③如Chrome一直致力于成为最快的浏览器，但相对的性能就中层，如对JavaScript的支持不高不低。Firefox则是相比下解析和表现网页性能最好的浏览器，对JavaScript的支持接近97%，但它的速度也是出了名的慢。IE就更不用说了，用自己的控件无视其他浏览器。
④扯了半天想说明的就是，各个浏览器会考虑各自的着重点，而出现不同的表现。DW中的浏览器考虑到其自身特性：面向对象的编程工具，它的解析就必须以更好的编程环境为目标，例如将在正常浏览器中看不到的脚步、锚点用图标表示出来，这就凭空占了部分空间了。还有例如表单中，你可以像在word中那样使用软回车(Shift Enter)让两个表单元素紧靠在一起，但在其他浏览器没有这玩意儿。等等。DW中会把很多标签表现得更具体生动，让程序员看得清楚。
⑤所谓成亦败也，DW这种为程序员着想的温馨初衷，职业程序员并不领情，而初学者却常常因此被带进云里雾里。
所以，要调试网页的话，还是直接打开IE和FF等浏览器进行预览吧。

Answer 4

这个每一个解码器解出来的未必就一样，比如dreamweaver的显示他肯定用的也是莫个浏览器的解码内核，我估计是IE的，内核不一样的浏览器有些东西解码就是不一样，这个得要慢慢琢磨

Answer 5

首先设计的时候是以浏览器的效果为主的
Dreamweaver里的效果只是个参考，方便你编写代码以及快速查找

如果真想在Dreamweaver看到实时的效果
在工具栏里有个实时视图的按钮点了就可以了

当然这也就失去了快速查找的功能