利用ie的behavior属性兼容css3的一些属性

时间:2021-10-05 12:22:51

behavior是从Internet Explorer 5开始引入的,是一种通过使用 CSS 向 HTML 元素添加行为的方法。

但是只有 Internet Explorer 支持 behavior 属性,所以在实际中我们不建议使用这个属性,在实际中

我们都是使用 JavaScriptHTML DOM 来对HTML元素添加行为的。

在最近的工作中,遇到了兼容css3属性,例如border-radius,那么此时就可以用到behavior这个属性。

具体代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>1</title>
<style type="text/css">
.test{
width:200px;
height:100px;
background-color:#f00;
border-radius: 10px;
box-shadow:1px 1px 2px;
text-shadow: 5px 5px 2px #ffffff;
behavior: url(ie-css3.htc);
}
</style>
</head>
<body>
<div class="test">
lalalallalalalal
</div> </body>
</html>

ie-css3.htc 具体文件可以在文件里下载,我自己试过, border-radius、box-shadow、text-shadow都可以被兼容(只试了这几个属性,其他的有时间再试试)。

但兼容后的效果不是特别的完美,感觉应该是用IE的滤镜做了兼容。