实际上是指的是一个名为pie的htc文件,即pie.htc,使用CSS的behavior行为,可以调用此文件,然后让IE也能实现一些常见的 CSS3效果,如圆角(border-radius),盒阴影(box-shadow),背景渐变(gradient),多图片背景(multiple background images)。

    支持的主要CSS3属性:
    1.border-radius圆角
        CSS代码如下:
        .pie_radius{ width:250px;height:250px;background-color:#34538b;-moz-border-radius:10px;      -webkit-border-radius:10px;border-radius:10px;behavior:url(pie.htc);}
        html代码如下:
        <div class="pie_radius"></div>
    2.box-shadow 盒阴影
        CSS代码如下:
        .pie_box_shadow{width:250px;height:250px;background-color:#34538b;-moz-box-shadow:1px 3px 3px #666;-webkit-box-shadow:1px 3px 3px #666;box-shadow:1px 3px 3px #666;behavior:url(pie.htc);}
        html代码如下:
        <div class="pie_box_shadow"></div>
    3.gradient渐变
         CSS代码如下:
        .pie_gradient{width:250px;height:250px;background-color:#9F9;background:-webkit-gradient(linear, 0 0, 0 bottom, from(#9F9), to(#393));background:-moz-linear-gradient(#9F9, #393);      -pie-background:linear-gradient(#9F9, #393);behavior:url(pie.htc);  }
        html代码如下:
        <div class="pie_gradient"></div>
   4.问题说明:
       a.IE下这些CSS3效果实现是借助于VML,由VML绘制圆角或是投影效果的容器元素,然后这个容器元素作为目标元素的后兄弟节点插入,如果目标元素position:absolute 或是 position:relative,则这个css3-container元素将会设置与之一样的z-index值,在DOM tree中,同级的元素总是后面的覆盖前面的,所以这样就实现了覆盖,又避免了可能有其他元素正好插入其中。所 以,问题来了,如果目前元素的position属性为static,也就是默认属性,则z-index属性是没有用的,无覆盖可言,所以此时IE浏览器下 CSS3的渲染是不会成功的。要解决也很简单,设置目标元素position:relative或是设置祖先元素position:relative并赋 予一个z-index值(不可为-1)。
        b.IE浏览器的behavior 属性是相对于HTML文档而言的,与CSS其他的属性不一样,不是相对于CSS文档而言的。这使得使用pie.htc文件不怎么方变。如果绝对路径于根目 录,则CSS文件不方便移动;如果相对路径与HTML文档,则pie.htc文件在不同HTML页面见的重用性大大降低。同时,诸如border- image后面的URL属性路径也不好处理。 
       c.使用PIE实现IE下的CSS3渲染(其他方法也是一样),只能使用缩写的形式,例如圆角效果,我们可以设置border-top-left-radius表示左上圆角,但是PIE确实不支持这种写法的,只能是老老实实的缩写。
        d. 要想让IE浏览器支持htc文件,需要一个有着”text/x-component” 字样的content-type 头部,否则,会忽视behavior。绝大数web服务器提供了正确的content-type,但是还有一部分则有问题。
        e.由于某种原因,您无法修改服务器配置(例如公用主机,或是空间服务商提供的服务器),您可以用一个PHP文件来间接调用htc文件。
            <?php  header( 'Content-type: text/x-component' );  include( 'pie.htc' );  ?>
        通过PHP文件来增加一个含有“text/x-component”字样的Content-type头,同时调用pie.htc文件。需要将pie.php和pie.htc放在同一个文件夹目录下,同时CSS中的behavior写法应该是:
              behavior: url(pie.php);

PIE的使用的更多相关文章

  1. [No0000A2]“原始印欧语”(PIE)听起来是什么样子?

    "Faux Amis"节目中经常提到"原始印欧语"(PIE)——"Proto-Indo-European". 我们说过,英语,法语中的&qu ...

  2. poj3311 Hie with the Pie (状态压缩dp,旅行商)

    Hie with the Pie Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 3160   Accepted: 1613 ...

  3. pygame 练习之 PIE game (以及简单图形训练)

    简单的大饼游戏,掌握pygame中直线以及圆弧的画法,以及对输入的响应. import math import pygame, sys from pygame.locals import * pyga ...

  4. Pizza Pie Charts – 基于 Snap SVG 框架的响应式饼图

    Pizza Pie Charts 是一个基于 Adobe 的 Snap SVG 框架的响应式饼图插件.它着重于集成 HTML 标记和 CSS,而不是 JavaScript 对象,当然Pizza Pie ...

  5. 【poj3122】 Pie

    http://poj.org/problem?id=3122 (题目链接) 题意 给出N个pie的半径和F个friend,每个friend得到的pie必须一样,求每个人能得到的pie的最大大小. so ...

  6. tcpdump for android L 5.x with pie support

    由于使用了NDK编译的可执行文件在应用中调用,在4.4及之前的版本上一直没出问题. 最近由于要测试在Android L上的运行情况发现,当运行该可执行文件时,报如下错误: error: only po ...

  7. 分馅饼 Pie

    Pie 链接:http://acm.hust.edu.cn/vjudge/contest/view.action?cid=85904#problem/C 题目: Problem Description ...

  8. Pie(二分POJ3122)

    Pie Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 12985   Accepted: 4490   Special Ju ...

  9. poj3122 pie

    方法:二分. 题目意思:要过生日了,我请大家吃pie,然后人数一共是f+1(我自己).每个人的pie不能是拼接的,而且每个人的面积是一样的,这样就用二分枚举. 范围是0-最大的那块pie. 然后用每一 ...

  10. PIC和PIE

    PIC指的是位置无关代码,用于生成位置无关的共享库,所谓位置无关,指的是共享库的代码断是只读的,存放在代码段,多个进程可同时公用这份代码段而不需要拷贝副本.库中的变量(全局变量和静态变量)通过GOT表 ...

随机推荐

  1. C# 正则提取字符串(提取一个或多个)

    实例一:string result = ""; string str = "大家好! <User EntryTime='2010-10-7' Email='zhan ...

  2. TestNG+Excel+(HTTP+JSON) 简单接口测试

    说明: 1.使用Exce作为数据存放地: 2.使用TestNG的Datarprovide 做数据供应: 3.不足的地方没有指定明确的result_code , error_code , ERROR_M ...

  3. TP5 助手函数与TP3.2单字母函数

    一.TP5 助手函数 助手函数 描述 abort 中断执行并发送HTTP状态码 action 调用控制器类的操作 cache 缓存管理 config 获取和设置配置参数 controller 实例化控 ...

  4. Go 自学笔记

    1. 最近花时间简单自学了一下go语言的语法..为了保证自己不是每次从0 开始 这次简单进行一下记录 保证 学习 效果. 2. 安装 直接下载go的包 进行安装 以及 暗转goland2018.3 进 ...

  5. linux下安装java jdk

    第一步:查看java对应版本               yum search java 我自己装的是1.8版本的java包 第二步:装java包 yum install java-1.8.0-ope ...

  6. MySQL 5.6 & 5.7最优配置文件模板

    Inside君整理了一份最新基于MySQL 5.6和5.7的配置文件模板,基本上可以说覆盖90%的调优选项,用户只需根据自己的服务器配置稍作修改即可,如InnoDB缓冲池的大小.IO能力(innodb ...

  7. Ubuntu终端命令--查看端口占用及关闭

    1.查看已连接的服务端口 (ESTABLISHED)     netstat-a 2.查看所有的服务端口(LISTEN,ESTABLISHED)     netstat-ap 3.查看指定端口,可以结 ...

  8. Qt托盘程序

    使用QSystemTrayIcon类可以实现托盘程序.在这里使用QMainWindow做实例: mainwindow.h头文件 #ifndef MAINWINDOW_H #define MAINWIN ...

  9. BZOJ5297 CQOI2018社交网络(矩阵树定理)

    板子题. #include<iostream> #include<cstdio> #include<cmath> #include<cstdlib> # ...

  10. poj2761 feed the dog

    题目链接:http://poj.org/problem?id=2761 Description Wind loves pretty dogs very much, and she has n pet ...