CSS3 Pie工具推荐--让IE6-8支持一些优秀的CSS3特性


Posted in HTML / CSS onSeptember 02, 2014

首先看到能让IE8及以下的IE亲们用上css3的border-radius和Gradient还有box-shadow着实兴奋了一大把。是的,你没有看错,用css3PIE就可以了,想了解猛戳链接。这里也不介绍怎么使用了,官方有文档。

这是一坑

但还是要提一下,在使用过程中的pie路径一定要是相对于正在浏览页面的相对路径。如下代码的url路径不是相对于css文件所在路径。因为虽然是在css里写的url,但是是在css被应用前就对html起作用了。

复制代码
代码如下:

behavior: url(path/to/pie_files/PIE.htc);

其中的PIE.htc文件就是pie的灵魂所在了,当然你也可以用他zip包里的js来实现。(那个包里很全的,你根据自己要用的方法选择一个对应的文件就可以了,没必要全部贴到项目里)

这是第二坑

路径弄对了,想说,要在IE下看一看奇迹的出现!但!!注意这个但,第一次使用的时候,被pie处理的Element背景就全消失了,重点是,官方的start教程根本没提这一情况。

如果出现这种情况,表示,你使用的方法是对的,其实PIE已经生效了,至于为什么背景不见了,解决办法如下。

复制代码
代码如下:

yourCssSelector{ position:relative;}
/*或者*/
yourCssSelector{ position:absolute;}

如果还是没解决,请给你的element加上一个合适的z-index的属性。
然后一切就正常了

不要太天真

请不要在:after、:before中使用pie,这样完全无效。

来自jason的解释

复制代码
代码如下:

No, unfortunately. The reason is that pseudo-elements have no DOM and therefore there's nothing that PIE can manipulate.

最后我有一个很不解的问题,在fancybox上用pie,貌似不管怎么解决方法,背景还是不会出现!!如果有解决的朋友,一定要!!一定要告诉我!!!
HTML / CSS 相关文章推荐
使用Filters滤镜弥补CSS3的跨浏览器问题以及兼容低版本IE
Jan 23 HTML / CSS
CSS3 制作旋转的大风车(充满童年回忆)
Jan 30 HTML / CSS
一张图片能隐含千言万语之隐藏你的程序代码
Dec 13 HTML / CSS
html5 Canvas画图教程(9)—canvas中画出矩形和圆形
Jan 09 HTML / CSS
深入解析HTML5使用SVG图像时的viewBox属性用法
Sep 02 HTML / CSS
利用HTML5 Canvas API绘制矩形的超级攻略
Mar 21 HTML / CSS
浅谈HTML5新增和废弃的标签
Apr 28 HTML / CSS
CSS3通过var()和calc()函数实现动画特效
Mar 30 HTML / CSS
CSS 文字装饰 text-decoration & text-emphasis 详解
Apr 06 HTML / CSS
Html5通过数据流方式播放视频的实现
Apr 27 HTML / CSS
Unicode中的CJK(中日韩统一表意文字)字符小结
Dec 06 HTML / CSS
HTML5页面打开微信小程序功能实现
Sep 23 HTML / CSS
css3中背景尺寸background-size详解
Sep 02 #HTML / CSS
css3中transition属性详解
Sep 02 #HTML / CSS
纯css3实现鼠标经过图片显示描述的动画效果
Sep 01 #HTML / CSS
纯css3实现效果超级炫的checkbox复选框和radio单选框
Sep 01 #HTML / CSS
css3设置box-pack和box-align让div里面的元素垂直居中
Sep 01 #HTML / CSS
CSS3实例分享--超炫checkbox复选框和radio单选框
Sep 01 #HTML / CSS
CSS实现限制字数功能当对象内文本溢出时显示省略标记
Aug 20 #HTML / CSS
You might like
MySql 按时间段查询数据方法(实例说明)
2008/11/02 PHP
hadoop中一些常用的命令介绍
2013/06/19 PHP
解析php常用image图像函数集
2013/06/24 PHP
php三维数组去重(示例代码)
2013/11/26 PHP
PHP抓取、分析国内视频网站的视频信息工具类
2014/04/02 PHP
PHP删除指定目录中的所有目录及文件的方法
2015/02/26 PHP
php常用数组array函数实例总结【赋值,拆分,合并,计算,添加,删除,查询,判断,排序】
2016/12/07 PHP
JavaScript 异步调用框架 (Part 5 - 链式实现)
2009/08/04 Javascript
使用JQUERY Tabs插件宿主IFRAMES
2010/01/01 Javascript
JavaScript 变量作用域分析
2011/07/04 Javascript
jtable列中自定义button示例代码
2013/11/21 Javascript
js解决弹窗问题实现班级跳转DIV示例
2014/01/06 Javascript
jQuery的end()方法使用详解
2015/07/15 Javascript
对于Javascript 执行上下文的全面了解
2017/09/05 Javascript
JavaScript分步实现一个出生日期的正则表达式
2018/03/22 Javascript
详解angular分页插件tm.pagination二次触发问题解决方案
2018/07/20 Javascript
vue将毫秒数转化为正常日期格式的实例
2018/09/16 Javascript
kafka调试中遇到Connection to node -1 could not be established. Broker may not be available.
2019/09/17 Javascript
Vue发布订阅模式实现过程图解
2020/04/30 Javascript
[03:04]DOTA2英雄基础教程 影魔
2013/12/11 DOTA
[38:41]2014 DOTA2国际邀请赛中国区预选赛 LGD VS CNB
2014/05/22 DOTA
用Python实现协同过滤的教程
2015/04/08 Python
Python制作爬虫采集小说
2015/10/25 Python
python 时间戳与格式化时间的转化实现代码
2016/03/23 Python
Python进行数据提取的方法总结
2016/08/22 Python
Python字典及字典基本操作方法详解
2018/01/30 Python
Python sorted函数详解(高级篇)
2018/09/18 Python
详解用python自制微信机器人,定时发送天气预报
2019/03/25 Python
python实现微信每日一句自动发送给喜欢的人
2019/04/29 Python
基于h5py的使用及数据封装代码
2019/12/26 Python
python 用opencv实现图像修复和图像金字塔
2020/11/27 Python
美国传奇滑手Paul Rodriguez创办的街头滑板品牌:Primitive Skateboarding
2019/10/29 全球购物
美国领先的机场停车聚合商:Airport Parking Reservations
2020/02/28 全球购物
Ajax主要包含了哪些技术
2014/06/12 面试题
毕业生应聘幼儿园的自荐信
2013/11/20 职场文书
python中的plt.cm.Paired用法说明
2021/05/31 Python