让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 3D位移translate效果实例介绍
May 03 HTML / CSS
移动端rem布局的两种实现方法
Jan 03 HTML / CSS
Web页面中八种创建多列等高(等高列布局)的实现技术
Dec 24 HTML / CSS
利用css3制作3D样式按钮实现代码
Mar 18 HTML / CSS
纯css3实现的动画按钮的实例教程
Nov 17 HTML / CSS
深入浅析css3 border-image边框图像详解
Nov 24 HTML / CSS
详解CSS3的perspective属性设置3D变换距离的方法
May 23 HTML / CSS
CSS3实现多重边框的方法总结
May 31 HTML / CSS
利用简洁的图片预加载组件提升html5移动页面的用户体验
Mar 11 HTML / CSS
HTML5 Web Database 数据库的SQL语句的使用方法
Dec 09 HTML / CSS
canvas使用注意点总结
Jul 19 HTML / CSS
HTML5在IE10、火狐下中文乱码问题的解决方法
Nov 18 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
php下拉选项的批量操作的实现代码
2013/10/14 PHP
Ecshop 后台添加新功能栏目及管理权限设置教程
2017/11/21 PHP
jQuery Div中加载其他页面的实现代码
2009/02/27 Javascript
JQuery拖拽元素改变大小尺寸实现代码
2012/12/10 Javascript
JavaScript中的Web worker多线程API研究
2014/12/06 Javascript
JavaScript中通过提示框跳转页面的方法
2016/02/14 Javascript
JS实现左右无缝轮播图代码
2016/05/01 Javascript
JS实现弹出居中的模式窗口示例
2016/06/20 Javascript
Vue.js每天必学之表单控件绑定
2016/09/05 Javascript
功能强大的jquery.validate表单验证插件
2016/11/07 Javascript
Vue中父组件向子组件通信的方法
2017/07/11 Javascript
JavaScript30 一个月纯 JS 挑战中文指南(英文全集)
2017/07/23 Javascript
基于vue 实现token验证的实例代码
2017/12/14 Javascript
node结合swig渲染摸板的方法
2018/04/11 Javascript
JS通过位运算实现权限加解密
2018/08/14 Javascript
基于Vue-Cli 打包自动生成/抽离相关配置文件的实现方法
2018/12/09 Javascript
ES6基础之默认参数值
2019/02/21 Javascript
laravel-admin 与 vue 结合使用实例代码详解
2019/06/04 Javascript
JS中getElementsByClassName与classList兼容性问题解决方案分析
2019/08/07 Javascript
Pyramid添加Middleware的方法实例
2013/11/27 Python
Windows下安装python2.7及科学计算套装
2015/03/05 Python
Python中你应该知道的一些内置函数
2017/03/31 Python
python使用KNN算法手写体识别
2018/02/01 Python
python的常见矩阵运算(小结)
2019/08/07 Python
python 实现目录复制的三种小结
2019/12/04 Python
关于Python turtle库使用时坐标的确定方法
2020/03/19 Python
Python使用graphviz画流程图过程解析
2020/03/31 Python
python实现测试工具(二)——简单的ui测试工具
2020/10/19 Python
python3爬虫中引用Queue的实例讲解
2020/11/24 Python
快速解决pymongo操作mongodb的时区问题
2020/12/05 Python
详解CSS3中使用gradient实现渐变效果的方法
2015/08/18 HTML / CSS
班主任经验交流材料
2014/12/16 职场文书
房地产公司工程部经理岗位职责
2015/04/09 职场文书
党支部鉴定意见
2015/06/02 职场文书
学生会部长竞选稿
2015/11/19 职场文书
go结构体嵌套的切片数组操作
2021/04/28 Golang