css3 pie怎么用


本文摘自PHP中文网,作者藏色散人,侵删。

css3 pie的使用方法:首先下载CSS3PIE插件;然后将pie.htc文件,放到项目的文件夹中;接着在css代码中在需要使用css3的地方添加“behavior: url(PIE.htc)”;最后指定到htc文件的位置即可。

本教程操作环境:windows7系统、css3版,该方法适用于所有品牌电脑。

推荐:《css视频教程》

CSS3pie是什么?

CSS3pie是一款非常优秀的CSS3工具,可以让IE6至IE8版本实现大多数的CSS3修饰特性,如圆角、阴影、渐变等等,通过这个工具,可以在线修改想要的效果,并即时生成css代码。

css3pie怎么用?

1、下载CSS3PIE插件

下载地址:http://css3pie.com/download/ GitHub https://github.com/lojjic/PIE/downloads

2、使用

在下载完成的压缩里面,里面有三个文件,有一个名字为PIE.htc的文件,这就是让IE6-8能够支持部分css3特征的插件。

将pie.htc 文件,放到我们项目的文件夹中。

在css代码中在需要使用css3的地方添加behavior: url(PIE.htc);指定到htc文件的位置就可以了(相对于html文档)。

示例:

包括圆角、阴影和渐变三种效果。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

.pie{

width: 200px;

height: 100px;

line-height: 100px;

font-size:14px;

border: 1px solid #669966;

text-align: center;

-webkit-border-radius: 8px;

-moz-border-radius: 8px;

border-radius: 8px;

-webkit-box-shadow: #666666 0 2px 3px;

-moz-box-shadow: #666666 0 2px 3px ;

box-shadow: #666666 0 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;

}

效果图:

894fc08b349a3faed268de9ec2f88af.png

更多web前端开发知识,请查阅 HTML中文网 !!

以上就是css3 pie怎么用的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

CSS3怎么让文字垂直居中显示

animation-iteration-count属性怎么用

css如何给边框添加图像?css设置边框图像

关于老式浏览器兼容html5和CSS3的问题详解

text-emphasis属性有什么用

CSS3 sticky不生效怎么办

CSS3 @media怎么不起作用?是什么原因?

有趣的css魔法和布局(代码)

CSS3 menu怎么用

CSS3实现一个奥运五环

更多相关阅读请进入《CSS3》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...