最新消息:

firebug复制网页代码致使DOCTYPE声明丢失

Web前端开发 大步 782浏览 0评论

一个礼拜前,一个网友让我帮他改下网站的代码,达到他的要求。但是改完后发给他,发现网页排版在IE里完全变了样,整个网站的div无法居中,全部往浏览器左边挤压,ul标签页乱了。

 

开始怀疑是写网站的没有考虑 IE和firefox在处理ul,ol等标签的差别,但是后来看到网站管理员是已经处理过的了这个问题,里头有个reset.css来专门解决这个问题。我没改代码前,网站在IE下正常。而改了后,在firefox和chrome下正常,而在IE不正常了。见下图(使用HyperSnap滚动截图的):

 

我只改了html和css代码,通过排除法,排除了是css问题,最后锁定为htnl代码有问题。接着,拿原来的html代码文件和修改过后的代码文件进行diff,终于找到了原因。这个结果让我也意外,居然是 html 文件的 <!DOCTYPE> 声明丢失了。我是在火狐下用firebug调试代码的,修改后直接通过firebug的复制代码功能,结果firebug并没有把 <!DOCTYPE> 声明 一起复制过去,才导致了 网页div在 IE 下无法居中的问题。

 

关于firebug保存修改后的html代码的问题!!

方法一的问题:当用firebug修改完html代码时候,而html代码处于折叠状态,然后 ctrl+a  ,ctrl+c。接着粘贴到编辑器中保存,你会发现,firebug没有复制那些被折叠的代码!!

方法二的问题:当html代码处于折叠状态,当我们ctrl+a 选中所有html代码,然后点击鼠标右键选择 “复制” ,粘贴到编辑器中时候,也会发现,firebug没有复制那些被折叠的代码!!

方法三的问题:当html代码处于完全折叠状态(即整个html标签都折叠成一行),当我们ctrl+a 选中所有html代码,然后点击鼠标右键选择 “复制html” ,粘贴到编辑器中时候,发现可以复制那些被折叠的代码,但是却丢失了<!DOCTYPE> 声明!!!
我就是属于这种原因才导致ie中排版出现问题,所以建议使用这种方法的手动复制下<!DOCTYPE>,注意firefox自带的web工具也会有这个问题

方法四:直接ctrl+s (相当于使用浏览器的保存网页功能)。

 

 

firefox自带的web工具其实有的地方比firebug好用,还有web  developer在图片和色值之类的都比firebug强些,仿站必备的玩意。

firefox其他好用的插件,可参考《Firefox 好用必备插件收集和技巧

 

 

 

<!DOCTYPE> 声明丢失对IE与firefox、chrome的影响在于:

1.<!DOCTYPE> 丢失 对firefox和chrome完全没有影响
2.<!DOCTYPE> 声明丢失对IE来说就影响很大,导致网页(关键影响div标签)不能在IE浏览器中居中。<!DOCTYPE> 声明影响了浏览器对CSS解析。

更多信息请月阅读:

 

转载请注明:大步's Blog » firebug复制网页代码致使DOCTYPE声明丢失

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
SiteMap