先贴下各种浏览器下的效果图:
1、IE6
2、IE7
3、Chrome
<!DOCTYPE html><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>真正兼容IE6以上的圆角头像</title><style type="text/css">.header {width: 100px;height: 100px;background: url(/images/head.jpg) no-repeat center;border-radius: 50px;background-size: 100% 100%;*filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/head.jpg',sizingMethod='scale');*position: relative;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/head.jpg',sizingMethod='scale')\9;position: relative\9;}.header div {display: none;*display: block;display: block\9;width: 100%;height: 100%;position: absolute;z-index: 10;left: 0;top: 0;background: url(/images/balay.png) no-repeat center;}</style><!--[if IE 6]><script type="text/javascript" src="/js/ie6-png.min.js"></script><script type="text/javascript">DD_belatedPNG.fix('.header div');</script><![endif]--></head><body><div class="header"><div></div></div></body></html>
源代码下载