css3 pie使用方法：

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <style>

        .style{

            border: 1px solid #669966; padding: 60px 0pt; text-align: center; width: 200px; font-size:18px; font-family:"sans-serif";

                border-radius: 8px;

                box-shadow: #666 0px 2px 3px;

                background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));

                background: -webkit-linear-gradient(#EEFF99, #66EE33);

                background: -moz-linear-gradient(#EEFF99, #66EE33);

                -pie-background: linear-gradient(#EEFF99, #66EE33);

                behavior: url(PIE.htc);

                position:relative;

                z-index:10;

        }

    </style>

</head>

<body>

    <div class="style">css3 pie.htc DEMO</div>

</body>

</html>

特别提醒：

1、behavior的url里一定要填写htc文件的绝对路径（不管你用的是pie插件还是别的htc文件），因为 IE浏览器找该文件是相对当前html文件路径来找的，所以对于Wordpress等动态程序生成的页面一定要填写绝对路径。

2、一定要有定位属性：position:relative;

3、因为在IE浏览器下这些CSS3效果的实现是要借助于VML，由VML绘制圆角或是投影效果，所以还需要一个z-index属性。z-index属性最好设置得比较大，如2。

4、如果在IE浏览器下某些模块无法用此渲染，可以试着绝对定位相应的层，即加上“ width: 400px; height:400px;”属性。

5、radius属性的10px是圆角半径，还可以给两个值如“border-radius: 10px 5px;”，这样则左上角与右下角半径为10px，右上角与左下角半径为5px。也可以赋4个值，为“上  右  下  左”。

CSS3 Pie工具可以让IE6至IE8版本实现大多数的CSS3修饰特性，如圆角、阴影、渐变等的更多相关文章

  1. CSS判断不同分辨率显示不同宽度布局CSS3技术支持IE6到IE8

    CSS判断不同分辨率浏览器(显示屏幕)显示不同宽度布局CSS3技术支持IE6到IE8.将用到css3 @media样式进行判断,但IE9以下版本不支持CSS3技术,这里DIVCSS5给大家介绍通过JS ...

  2. css3前端工具

    随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...

  3. 11款CSS3动画工具的开发

    本文展示了11个最好的和最令人惊异的CSS3动画工具,将为开发者是非常有帮助的.CSS3有设计师和开发人员之间的良好的声誉.它是在这里帮助他们创造惊人的结果. 有了这些动画工具,你可以创造一个轻松自由 ...

  4. 让IE6/IE7/IE8支持CSS3属性的8种方法介绍

    我们都知道,IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现状,他们总是尽量使用一些手段使IE浏览器也能支持CSS3属性,我觉得这些都是很有意义,很有价值的工作,可以推动整个技术领域的 ...

  5. 让IE6/IE7/IE8浏览器支持CSS3属性

    让IE6/IE7/IE8浏览器支持CSS3属性 一.下载 您可以狠狠地点击这里:ie-css3.htc,这个玩意儿是让IE浏览器支持CSS3表现的关键东东. 二.上面的是什么东西 首先说说.htc文件 ...

  6. 记录各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

     记录遇到的IE BUG:  1.IE8开发者工具打不开 解决办法:IE8新增了开发人员工具,非常不错,比早期的DevToolbar好用多了.不过在我的Win7下 使用的时候偶尔会出现一个莫名其妙的问 ...

  7. 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

    完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法   HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...

  8. 一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

    行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10 2012-04-25 16:29:04| 分类: 学习 |字号 订阅 在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE ...

  9. 解决IE6/IE7/IE8不支持before,after问题

    对从事web开发的朋友来讲,低版本的IE永远是一个痛点,不支持最新技术(如css3,html5). 在现在web开发中使用图标字体已经很广泛,如Font Awesome,Bootstrap等,字体图片 ...

随机推荐

  1. windows下使用vnc viewer远程连接Linux桌面（转）

    在windows下使用vnc viewer远程连接Linux桌面,主要配置步骤: Linux: 1.rpm -qa vnc //查看是否安装vnc服务,如果没有安装,可以使用yum,或者rpm进行安装 ...

  2. winform使用xml作为数据源

    1.新建窗体应用程序 2.拖放DataGridView 3.在bin\Debug中放入XML文件 using System; using System.Collections.Generic; usi ...

  3. Qt中OpenGL的初步使用

    结果预览: 一.代码5个文件 //glwidget.h #ifndef GLWIDGET_H #define GLWIDGET_H #include <QGLWidget> class G ...

  4. Three.js学习笔记 – “我和小伙伴都惊呆了”的特效和Three.js初探

    什么是Three.js three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包 ...

  5. JavaScript 对象扩展代码

    JavaScript 扩展代码 更具需要写的几个扩展. 扩展核心自执行函数 Object.extend /** * 对象扩展体 参数是 {属性|方法:属性值|方法体} * 只执行实现 * * 实例对基 ...

  6. php中json_encode中文编码问题

    1 <?php 2 class myClass { 3 public$item1=1; 4 public$item2='中文'; 5 6 function to_json() { 7 //url ...

  7. 前端开发面试题收集 css

    什么是CSS盒子模型 页面上的每个元素都被浏览器看做是一个矩形的盒子. 由内容.填充.边框.边界组成. 什么是 css sprite 将多个图片拼接在一个图片中,通过background-positi ...

  8. python基础教程第2章——列表与元组笔记

    1.序列是Python中最基本的数据结构.序列中的每个元素被分配一个序列号——元素的位置,也称索引,第1个索引是0,第2为1,以此类推.序列中的最后1个元素为-1,倒数第2个位-2. python中有 ...

  9. 正确决解Hibernate4.*中：Connection cannot be null when 'hibernate.dialect' not set

    <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE hibernate-configuration PUBLIC "-//Hi ...

  10. EEPROM和flash的区别

    存储器分为两大类:ram和rom.ram就不讲了,今天主要讨论rom. rom最初不能编程,出厂什么内容就永远什么内容,不灵活.后来出现了prom,可以自己写入一次,要是写错了,只能换一片,自认倒霉. ...