`
阅读更多

>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年11月20日 10:35:10 星期五

http://fanshuyao.iteye.com/

 

项目下载地址及Demo:http://css3pie.com/

相关文档:http://css3pie.com/documentation/​

相关文章:http://www.zhangxinxu.com/wordpress/?p=967​

 

css3pie有三种处理方式,一种是使用htc文件,一种是使用js文件,一种是针对php使用php加载htc文件的。

 

第一种需要加上Content-type,但有些服务器默认不支持,还需要修改服务器的配置文件,好像挺麻烦的。

 

第二种最好,只是使用js(推荐使用)

使用js的优势:

Advantages of the JS version

Since it is a normal .js file, PIE.js does not suffer from some of the more annoying limitations of the PIE.htc behavior:

  • You can load PIE.js from a different domain than the HTML page.
  • You don't have to worry about your server not using the correct Content-type header for the file.
  • Referencing the PIE.js file via a relative path is simpler since you only have to do it once in each HTML page.
  • It is more easily integrated within JavaScript libraries.

第三种不说了。​

 

第二种(js)使用方法:​

官方文档:http://css3pie.com/documentation/pie-js/

Using PIE.js

If you've decided the above advantages outweigh the disadvantages for you, here's how you go about using PIE.js.

  1. Include the PIE.js script in your page, surrounded by a conditional comment to prevent it from being downloaded in other browsers:
    <!--[if IE]>
    <script type="text/javascript" src="path/to/PIE.js"></script>
    <![endif]-->
    Note: The code above is for PIE.js 1.0; if you are using a PIE 2.0 beta build, then you will need to include the appropriate JS file for the current IE version:
    <!--[if lt IE 9]>
      <script type="text/javascript" src="path/to/PIE_IE678.js"></script>
    <![endif]-->
    <!--[if IE 9]>
      <script type="text/javascript" src="path/to/PIE_IE9.js"></script>
    <![endif]-->
  2. Invoke the PIE.attach(el) function for each element that needs CSS3 styling. Make sure you do this after the page's DOM has been fully loaded. For example, using jQuery:
    $(function() {
        if (window.PIE) {
            $('.rounded').each(function() {
                PIE.attach(this);
            });
        }
    });

If you are going to add new elements to the page via JavaScript after the fact, you will have to make sure your JS code calls PIE.attach(el) for each new element that needs CSS3 styling. Calling attach for a particular element more than once is safe (PIE will ignore the call if the element has already been attached), so you don't need to worry about filtering out elements.

Also, if you remove elements from the page that had PIE attached, you will need to call PIE.detach(el) to clean up their CSS3 rendering.

 

​自己使用的:

之前加载PIE.js文件​

<!--[if IE]>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/PIE.js"></script>
<![endif]-->

 

if (window.PIE) {
        $('.css3,.form-control').each(function() {
            PIE.attach(this);
        });
}

 

​附件为PIE文件

 

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>

蕃薯耀 2015年11月20日 10:35:10 星期五

http://fanshuyao.iteye.com/

1
2
分享到:
评论

相关推荐

    使得IE支持CSS3 圆角阴影 渐变

    使得IE支持CSS3 圆角阴影 渐变

    CSS3实现圆角阴影渐变效果兼容IE等浏览器

    CSS3实现圆角阴影渐变效果兼容IE,火狐等主流浏览器,用过都说很好用,你懂的。

    ie8兼容html5 css3圆角阴影渐变placeholder等属性

    几个常用插件,让ie8兼容html5和css的圆角,阴影、渐变、placeholder等属性

    selectivizr让IE6-9获得css3的选择器之外,或获得了圆角、阴影、渐变色资源等css3属性的支持.rar

    selectivizr让IE6-9获得css3的选择器之外,或获得了圆角、阴影、渐变色资源等css3属性的支持

    ie支持css3部分功能

    让ie支持css3部分功能,阴影背景效果、圆角效果、渐变背景效果

    让IE6、IE7、IE8支持CSS3的圆角、阴影样式

    VML是The Vector Markup Language(矢量可标记语言),原本是微软自己开发的东西,很强大。也就是说,IE下面,可以用 VML做出圆角 。半透明、阴影 、渐变背景。

    让IE中支持css3.0效果

    但凡是前端工程师,都知道IE6,IE7,IE8不支持、或者不完全支持CSS3的属性。 CSS3 有很多很强大、绚丽的效果,比如,圆角,阴影,渐变透明,渐变背景,等等。 因为IE6时代,没有什么标准,而因为各种原因,IE6用户...

    兼容IE的C3

    让IE兼容css3的圆角、渐变、阴影等属性。

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

    CSS3 有很多很强大、绚丽的效果,比如,圆角,阴影,渐变透明,渐变背景,等等。 因为IE6时代,没有什么标准,而因为各种原因,IE6用户几乎不会更新IE版本。 让IE6,IE7,IE8支持CSS3效果,有一个思路就是利用 VML ...

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

    CSS3 Pie工具可以让IE6至IE8版本实现大多数的CSS3修饰特性,如圆角、阴影、渐变等等,通过这个工具,可以在线修改想要的效果,并即时生成css代码,有点意思了吧 ^^

    10个很棒的 CSS3 开发工具 推荐

    使用CSS3 Pie可以让IE6至IE8版本实现大多数的CSS3修饰特性,如圆角、阴影、渐变等等。→ 访问 CSS3 Pie CSS3 Builder 使用这款工具可以制作出漂亮的CSS3盒子,像是Photoshop制作出来的效果。→ 访问 CSS3 Builder ...

    CSS3,线性渐变(linear-gradient)的使用总结

    《CSS3 经典教程系列》的前一篇文章向大家详细介绍了 text-shadow 文本阴影特性的用法,今天这篇文章我们在一起来看看 CSS3 中实现渐变效果的 Gradient 属性的具体用法。在以前,渐变效果和阴影、圆角效果一样都是做...

    CSS3.0中文参考手册

    1) 圆角 这个功能已经在诸如 Mozilla, Webkit 等阅读器广泛运用,对 Web 设计者来说无疑是最受期待的,然而 IE 仍然没有要支持这个功能的迹象。 2) 多背景 这个功能是我最期待的,但向后兼容会是一个很大的疑问。 ...

    JQuery&CSS;&CSS;+DIV实例大全.rar

    3.JS+CSS美化经典Select选项框插件 4.JS+CSS通用一个页面同时三个焦点图轮换效果完整实例 5.JS+CSS网页版模拟QQ登录框界面特效示例 6.JS+flash立柱广告代码仿百度MP3搜索右侧可伸缩的立柱广告效果 7.JS版本...

    PIE-2.0beta1解决ie8以下兼容性插件

    CSS3 Pie支持的CSS3语法有: border-radius 圆角 box-shadow 块阴影 border-image 图片边框 multiple background images 多背景 linear-gradient as background image 线性渐变背景图片 CSS3 Pie是一个/PIE-2.0beta...

    HTML5与CSS3基础教程(第8版)高清文字

    第14章 使用CSS3进行增强 278 14.1 浏览器兼容性、渐进增强和polyfill 278 14.2 理解厂商前缀 280 14.3 为元素创建圆角 281 14.4 为文本添加阴影 284 14.5 为其他元素添加阴影 285 14.6 应用多重...

    code-stand:向上融科前端代码规范

    渐进退化,产品在 Chrome 及国内的 Chromium 内核浏览器上的体验应该做到最好,包括对圆角、阴影、渐变的支持,在 IE8 上可渐进退化,不建议通过 hack 的方式支持 CSS3 属性。HTMLDoctype使用标准的 ...

Global site tag (gtag.js) - Google Analytics