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 相关文章推荐
CSS3弹性盒模型开发笔记(三)
Apr 26 HTML / CSS
CSS3圆角边框和边界图片效果实例
Jul 01 HTML / CSS
CSS3绘制六边形的简单实现
Aug 25 HTML / CSS
CSS3模拟IOS滑动开关效果
Sep 28 HTML / CSS
CSS3新增布局之: flex详解
Jun 18 HTML / CSS
CSS3 transition 实现通知消息轮播条
Oct 14 HTML / CSS
html5组织文档结构_动力节点Java学院整理
Jul 11 HTML / CSS
html5 web本地存储将取代我们的cookie
Dec 26 HTML / CSS
canvas之自定义头像功能实现代码示例
Sep 29 HTML / CSS
HTML5中的websocket实现直播功能
May 21 HTML / CSS
使用SVG实现提示框功能的示例代码
Jun 05 HTML / CSS
用CSS3画一个爱心
Apr 27 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
一个PHP操作Access类(PHP+ODBC+Access)
2007/01/02 PHP
PHP中::、->、self、$this几种操作符的区别介绍
2013/04/24 PHP
php运行提示:Fatal error Allowed memory size内存不足的解决方法
2014/12/17 PHP
Jquery升级新版本后选择器的语法问题
2010/06/02 Javascript
原生JS可拖动弹窗效果实例代码
2013/11/09 Javascript
js中创建对象的几种方式示例介绍
2014/01/26 Javascript
javascript执行环境及作用域详解
2016/05/05 Javascript
全面解析Bootstrap中tab(选项卡)的使用方法
2016/06/06 Javascript
移动端使用localStorage缓存Js和css文的方法(web开发)
2016/09/20 Javascript
微信小程序实战之顶部导航栏(选项卡)(1)
2020/06/19 Javascript
微信小程序搜索组件wxSearch实例详解
2017/06/08 Javascript
用js实现before和after伪类的样式修改的示例代码
2017/09/07 Javascript
使用Vue写一个datepicker的示例
2018/01/27 Javascript
VUE+Element环境搭建与安装的方法步骤
2019/01/24 Javascript
后台使用freeMarker和前端使用vue的方法及遇到的问题
2019/06/13 Javascript
Vuex的热更替如何实现
2020/06/05 Javascript
[48:52]DOTA2上海特级锦标赛A组小组赛#2 Secret VS CDEC第一局
2016/02/25 DOTA
Python实现把数字转换成中文
2015/06/29 Python
在Django的URLconf中使用多个视图前缀的方法
2015/07/18 Python
Python使用multiprocessing实现一个最简单的分布式作业调度系统
2016/03/14 Python
Win8下python3.5.1安装教程
2020/07/29 Python
python高效过滤出文件夹下指定文件名结尾的文件实例
2018/10/21 Python
详解python读取image
2019/04/03 Python
wxPython:python首选的GUI库实例分享
2019/10/05 Python
django框架auth模块用法实例详解
2019/12/10 Python
Avène雅漾美国官方网站:敏感肌肤护理专家
2016/10/24 全球购物
安德玛比利时官网:Under Armour比利时
2019/08/28 全球购物
求职简历自荐信
2013/10/20 职场文书
运动会100米解说词
2014/01/23 职场文书
大专生自我评价
2014/01/28 职场文书
手工社团活动方案
2014/02/17 职场文书
扩大国家免疫规划实施方案
2014/03/21 职场文书
大学生党员个人总结
2015/02/13 职场文书
综合办公室岗位职责
2015/04/11 职场文书
Nginx 502 Bad Gateway错误原因及解决方案
2021/03/31 Servers
postgreSQL数据库基础知识介绍
2022/04/12 PostgreSQL