让IE6支持css3,让 IE7、IE8 都支持CSS3


Posted in HTML / CSS onOctober 09, 2011

CSS3 有很多很强大、绚丽的效果,比如,圆角,阴影,渐变透明,渐变背景,等等。
因为IE6时代,没有什么标准,而因为各种原因,IE6用户几乎不会更新IE版本。
让IE6,IE7,IE8支持CSS3效果,有一个思路就是利用 VML 模拟。
VML是The Vector Markup Language(矢量可标记语言),原本是微软自己开发的东西,很强大。
也就是说,IE下面,可以用 VML做出圆角 。半透明、阴影 、渐变背景。
早在去年的时候,就有老外这个思路写成了插件,方便前端程序员开发。。。
它可以让IE6,IE7,IE8 支持 CSS3特效……
之前的 bug 一直有一个严重 bug,今天上去看的时候,官方修正了这个Bug ,并且增加了js 渲染方法(之前是用behavior导入)。

--------------------------------------------------------------------------------
看看如何调用:
1、在你的网页加载 PIE.js 脚本。
注意,用IE专用的注释,防止非IE浏览器下载。

复制代码
代码如下:

<!--[if lt IE 10]>
<script type="text/javascript" src="PIE.js"></script>
<![endif]-->

2、用js 调用:
复制代码
代码如下:

$(function() {
if (window.PIE) {
$('.rounded').each(function() {
PIE.attach(this);
});
}
});

3、已经搞定了。

--------------------------------------------------------------------------------
在让 IE6支持 CSS3 的所有插件中,这个应该是最好的插件了。

官方实时测试例子:http://css3pie.com/
官方下载:http://css3pie.com/download-latest

--------------------------------------------------------------------------------
补充:
根据我对这个插件测试:最好在要加载效果的 box 增加CSS属性: overflow:hidden; 有些时候,圆角会出问题。

试用的时候,有问题,留言一起讨论一下。
有兴趣同学,可以看看源代码,加强对vml 的了解。。。

HTML / CSS 相关文章推荐
CSS3教程(9):设置RGB颜色
Apr 02 HTML / CSS
纯CSS3+DIV实现小三角形边框效果的示例代码
Aug 03 HTML / CSS
html5-canvas中使用clip抠出一个区域的示例代码
May 25 HTML / CSS
使用css创建三角形 使用CSS3创建3d四面体原理及代码(html5实践)
Jan 06 HTML / CSS
通过Canvas及File API缩放并上传图片完整示例
Aug 08 HTML / CSS
实例教程 HTML5 Canvas 超炫酷烟花绽放动画实现代码
Nov 05 HTML / CSS
html5使用canvas画空心圆与实心圆
Dec 15 HTML / CSS
利用HTML5实现使用按钮控制背景音乐开关
Sep 21 HTML / CSS
localstorage和sessionstorage使用记录(推荐)
May 23 HTML / CSS
HTML5添加禁止缩放功能
Nov 03 HTML / CSS
canvas绘制太极图的实现示例
Apr 29 HTML / CSS
完美实现CSS垂直居中的11种方法
Mar 27 HTML / CSS
利用CSS3的transform做的动态时钟效果
Sep 21 #HTML / CSS
CSS3 border-image详解、应用及jQuery插件
Aug 29 #HTML / CSS
CSS3 特效范例整理
Aug 22 #HTML / CSS
你正在寻找的CSS3 动画技术
Jul 27 #HTML / CSS
IE兼容css3圆角的实现代码
Jul 21 #HTML / CSS
10个很棒的 CSS3 开发工具 推荐
May 16 #HTML / CSS
IE下实现类似CSS3 text-shadow文字阴影的几种方法
May 11 #HTML / CSS
You might like
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
php等比例缩放图片及剪切图片代码分享
2016/02/13 PHP
在laravel5.2中实现点击用户头像更改头像的方法
2019/10/14 PHP
使用jQuery简化Ajax开发 Ajax开发入门
2009/10/14 Javascript
Jquery 获得服务器控件值的方法小结
2010/05/11 Javascript
jQuery的实现原理的模拟代码 -5 Ajax
2010/08/07 Javascript
javascript 图片裁剪技巧解读
2012/11/15 Javascript
密码框显示提示文字jquery示例
2013/08/29 Javascript
js处理表格对table进行修饰
2014/05/26 Javascript
使用原生js实现页面蒙灰(mask)效果示例代码
2014/06/20 Javascript
Javascript基础知识(二)事件
2014/09/29 Javascript
AngularJS学习笔记之ng-options指令
2015/06/16 Javascript
简洁实用的BootStrap jQuery手风琴插件
2016/08/31 Javascript
JSON与String互转的实现方法(Javascript)
2016/09/27 Javascript
微信小程序 SocketIO 实例讲解
2016/10/13 Javascript
浅谈PDF.js使用心得
2018/06/07 Javascript
微信小程序实现时间预约功能
2018/11/27 Javascript
JavaScript实现秒杀时钟倒计时
2019/09/29 Javascript
[07:39]第一届亚洲邀请赛回顾视频
2017/02/14 DOTA
python使用fileinput模块实现逐行读取文件的方法
2015/04/29 Python
Python入门之三角函数atan2()函数详解
2017/11/08 Python
浅谈HTML5中dialog元素尝鲜
2018/10/15 HTML / CSS
印度最大的网上花店:Ferns N Petals(鲜花、礼品和蛋糕)
2017/10/16 全球购物
美国隐形眼镜销售网站:ContactsDirect
2017/10/28 全球购物
国际领先的在线时尚服装和配饰店:DressLily
2019/03/03 全球购物
乐高奥地利官方商店:LEGO Shop AT
2019/07/16 全球购物
成人高等教育毕业生自我鉴定
2013/10/22 职场文书
测控技术与通信工程毕业生自荐信范文
2013/12/28 职场文书
党员组织关系介绍信
2014/02/13 职场文书
入职担保书范文
2014/05/21 职场文书
学术诚信承诺书
2014/05/26 职场文书
语文教研活动总结
2014/07/02 职场文书
安全例会汇报材料
2014/08/23 职场文书
2014年调度员工作总结
2014/11/19 职场文书
英文邀请函
2015/02/02 职场文书
详解Python自动化之文件自动化处理
2021/06/21 Python