1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 纯CSS实现兼容ie6以上的圆角头像

纯CSS实现兼容ie6以上的圆角头像

时间:2018-11-17 10:16:56

相关推荐

纯CSS实现兼容ie6以上的圆角头像

先贴下各种浏览器下的效果图:

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>

源代码下载

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。