浏览器对居中的背景图片的兼容性

    在IE5.5至IE7 、Safari、chrome中,当浏览器窗口少于内容宽度时，居中的背景图片转向以body左对齐。而在Opera及FF中,居中的背景图片依然以缩小的窗口宽度居中对齐，当浏览器窗口宽度少于内容宽度时，拖动横行滚动条就能察觉到页面内容与背景会有错位的现象。A1_Demo

    从测试结果得知Opera及FF中的,浏览器窗口宽度少于内容宽度时,内容块以body 左对齐。这里有一个突破点是在于把body转变为具有内容板块的特性。

    按照CSS的解析，个人认为在Opera及FF中所显示的为正确效果,在IE5.5至IE7 、Safari、chrome中否则为错误的解析。但错误的解析正是我们所需要的，因为此能避免有内容与背景会有错位的现象。

解决方案

    下面方案针对Opera及FF,目的令背景图片向body左对齐

为定义display:table;及width:100%;属性。A2_Demo为定义display:inline-table;及width:100%;属性。A3_Demo

两种的方案缺点

body根据页面内容高度而撑高，当内容不足一屏幕高度时，body将来不显示余下高度的背景。A4_Demo

    为此需要给及定义height:100%;属性值,来解决问题。A5_Demo