为IE整圆角和透明度的问题

之所以写这个,是因为自己弄主题的时候碰到了这个问题呢,也不得不感叹IE浏览器就是跟不上时代的潮流。写这个也孩子是为了给自己增加下熟练度。就这样吧:

首先是透明度的

  1. .transparent_class {  
  2.       filter:alpha(opacity=50);  
  3.       -moz-opacity:0.5;  
  4.       -khtml-opacity: 0.5;  
  5.       opacity: 0.5;  
  6. }  

 

接下来是圆角,这个感觉有点问题,我实际使用的时候不满意,方法就是要链接一个微软的脚本文件.

CSS如下所示:

  1. .main{  
  2. border: 2px solid #C0C0C0;  
  3. -moz-border-radius: 10px;  
  4. -webkit-border-radius: 10px;  
  5. border-radius: 10px;  
  6. position:relative;  
  7. z-index:2;  
  8. behavior: url(此处为ie-css3.htc文件的绝对路径);  

为实现:

  1. border-radius: 10px;     

就要链接上htc文件.

 

注意

1、behavior的url里一定要填写ie-css3.htc的绝对路径,因为 IE浏览器找该文件是相对当前html文件路径来找的,所以对于Wordpress等动态程序生成的页面一定要填写绝对路径。

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

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

 

 

 

http://u.115.com/file/f07da5e8f7

0 条评论