1.png图片设了padding后,图片往padding方向填充容器.
我之前在编写代码的时候都是在ff里弄的,"8月50洲..."字样是一张图,而那个人物等图像是背景图.设了"8月50洲.."图片的padding-top后在ff下显示正常,
可是,在做浏览器兼容性测试的时候在ie里看到的又不是那么回事了(ie6,ie7下显示不正常,ie8则和在ff里显示得一样),看下面的图,"8月50洲.."图片竟然按照padding多少填充了.比如,图片height=100px,设了padding-top:30px后,图片的高度自动填充为100+30了.
解决:a.改成按margin来就好了;
b.把滤镜的sizingmethod改为'crop',这样就不会自动填充了,图片的高度=100px,现在还是100px,但是padding属性却不起作用了,把padding改为margin就行了.
2.直接对img设padding不行.把img图片放到一个div容器里,对div容器设paddiing就行了.
注意，感谢园友“ 编程、为你执着-努力”的提问，我知道了原来我对img设padding无效，和我所用的一个js文件有关，且是针对*.png图片，不是ie6本来的bug，而是那个js文件的bug，我那个js就是网上很流行的correctPNG.js，原理是给遍历*.png图片，给它们加滤镜。
把代码贴出来，希望和我一样这个js的园友们能看到这个解决方案。
function correctPNG() // correctly handle PNG transparency in Win IE 5.5 & 6.
{
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])
if ((version >= 5.5) && (document.body.filters))
{
for(var j=0; j<document.images.length; j++)
{
var img = document.images[j]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style=\"" + "" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src=\'" + img.src + "\', sizingMethod='crop');\"></span>"
img.outerHTML = strNewHTML
j = j-1
}
}
}
}
window.attachEvent("onload", correctPNG);
第二个问题是另一种解决方法是，引入js时加入条件注释，
<!--[if lt IE 7]> <script type="text/javascript" src="js/correctPNG.js"></script> <![endif]-->