国外团队开发的兼容插件,去年做项目时才发现,非常强大 主角:PIE.js , PIE.htc 两种方法可以实现 官方网站:http://css3pie.com/ 演示地址:http://css3pie.com/demos/gradient-patterns/ 重要功能实现: 可以使 IE6.7.8 .9 实现类似 chrome 和 firefox 1. 更自然逼真的阴影效果,不再是以前那种丑陋的滤镜效果. 2. 实现很自然的圆角效果 3. 实现部分 CSS3 的强悍效果,如 多背景图,borde…

下面说说如何对 IE10 以下版本的浏览器进行部分 CSS3 兼容 国外团队开发的兼容插件,去年做项目时才发现,非常强大 主角:PIE.js ,  PIE.htc    两种方法可以实现 官方网站:http://css3pie.com/ 演示地址:http://css3pie.com/demos/gradient-patterns/ 重要功能实现: 可以使 IE6.7.8 .9 实现类似 chrome 和 firefox 1.  更自然逼真的阴影效果,不再是以前那种丑陋的滤镜效果. 2.  实现…

虽然现在很多项目已经对低版本IE不要求了,但是还有部分公司对IE8还是很执着的,咱作为屌丝前端程序员不能和老板说前端潮流,不能说趋势,只能动脑子了,下面就分享一些css3兼容ie8的方案思路.主要是实现弯道超车. 比如css3的nth-child选择器,它有多好用就不解析了,问题它不兼容ie8,怎么破呢? 1.用jq选择器实现弯道超车,比如我想选择前面五个li,可以这样选.$("li:nth-child(-n+5)").css().这样就利用jq实现了兼容,但是能用css解决的就尽力不…

经过长久以来的不懈努力,我终于成功的将selectivizr与PIE这两个解决css3的利器进行了深度的整合,大大降低了使用难度 <!--[if lte IE 9]><script src="/js/selectivizr.js"></script><![endif]--> 只要在你的页面上加入这一行代码,整个页面全部兼容css3,不要忘了将文件下载回来放进/js/文件夹 兼容圆角border-radius,盒阴影box-shadow.渐…

CSS3的标准并没有全部定稿,目前CSS3的标准分成了不同的模块,具体的标准由各个模块推动标准和定稿,标准制定的过程中,浏览器也在不断的发新的版本来兼容新的标准.浏览器有时会给一些在试验阶段或非标准阶段的css属性添加前缀, 这样开发者就可以使用 浏览器行为的改变不会破坏标准. 开发人员应等待包含无前缀属性,直到浏览器行为标准化. 1. 主流浏览器引擎前缀 -webkit- (谷歌, Safari, 新版Opera浏览器等)-moz- (火狐浏览器)-o- (旧版Opera浏览器等)-ms- (…

如果一个图层中(navin)使用了pie.htc来对ie6,7,8进行兼容,如若上一层(navwrap)的样式中有背景的属性,则此层 (navin) 在ie6,7,8中背景颜色不显示.如下图:此部分的代码如下:   .navwrap { height:162px; background:#009BBD; }  .navin { height:33px; border-radius:17px; font-size:16px; color:#fff; padding-left:15px; line-…

当你看到这样的效果图是不是已经崩溃了 css3没出来之前大部分人基本都是用图片的方式拼出来的 腾讯邮箱就是这么做的 然后你想和设计说换直角吧.我用图片的好烦的感觉!而且我们还要兼容到ie6 她和你说别人能做到你为啥不能 然后本人只能用曾经被遗忘的一个小插件完成了这个奇怪的东西 PIE http://css3pie.com/documentation/pie-js/ 有了pie.js,做效果再也不用考虑浏览器了(当然这句水分比较足,和金坷垃一样) <!--[if IE]> <script…

有时候你会发现你写的animation动画的css3效果,在IE.谷歌.火狐等主流的新版本的浏览器的是没有什么兼容问题的,即便你不写前缀,也是可以显示动画效果的.然后,你本地在360浏览器或猎豹浏览器下(我只试了这两个)打开,动画效果是不出来的,一开始你会想到是前缀问题,那么我把前缀加上,好像有时可以有时不可以.360跟猎豹采用的都是谷歌跟IE的双内核,为什么会出现这个问题?是因为360浏览器分兼容模式和极速模式,极速模式下有兼容问题,兼容模式下问题较少,这就导致了极速模式下不支持css3. 解…

关于css3我先介绍几个简单的选择器: 先进行设置: 字符串匹配属性选择器: E[alt^="a"]  选择属性中以a开头的元素: E[alt$="a"]  选择属性中以a结尾的元素: E[alt*="a"]  选择属性中包含a的元素: 见以下例子: 结果如下: 伪类选择器: 先看以下的例子: 结果: 以上是几个选择器作用的结果,下面我依次讲解例子中各选择器的作用: 1.E:nth-child():匹配父元素中的第几个子元素 2.E:nth-la…

想想10年前用 IE6,火狐,遨游,谷歌等浏览器学习css时,那叫一个艰苦,各种hack各种抓耳挠腮,不是margin塌陷就是元素飞了... 当前借着css3这个东风,如果各大浏览器厂商能统一一下,也算给web开发者的一个福音了 不过国内新老兼修的企业电脑,也足够头疼的,毕竟还是有很多企业甚至部门仍坚持使用老的window,导致不得不兼容老版本的浏览器了 所以即使你采用css3也不得不考虑这么这个问题 前缀 兼容内核 相关浏览器 -ms- Trident ie,360,猎豹,遨游,百度,世界之窗…