msgbartop
勤反思,戒执迷
msgbarbottom

背景图1像素偏差

日期:2010-07-14 分类:像素差异, 前端制作

DEMO-1:给页面设置960px的纯黑色背景图横向居中,同时内部960px宽的容器设置纯色背景,得出各浏览器下效果如图,从上到下依次为了firefox、chrome、IE 8、IE 8自带IE 7标准模式、IE6

背景图1像素差异示例

仔细看IE6的左下角可以看到,背景图向右偏了1像素。解决办法么,CSS还没强大到有background-position:center-1px的写法,只好给内容器设置{_position:relative;_left:1px;}向右移一像素。

再进一步,DEMO-2,尝试给两个div设置高度,让浏览器出现滚动条,那么会发现chrome下也会像IE 6一样出现偏移,这时候就需要给chrome写hack。写法可以参考aliued的文章说说CSS Hack 和向后兼容