CSS透明实现办法[网站美工]

关于css 透明度,有一点需求注意的是,它固然利用了很多年,但它一向以来都不是一个尺度属性.它是一种非尺度技术,应当是css3标准的一部份.

　　1、旧的opacity设置
　　以下代码是firefox和safari旧版本所需的透明度设置:

#myelement { -khtml-opacity: .5; -moz-opacity: 0.5; }   

-khtml-opacity设置是针对旧版本的webkit渲染引擎,这种专用属性目前已经过期了,除非你还有需求兼容safari 1.x.的用户.
　　第二行利用专用属性 -moz-opacity是 为了兼容mozilla渲染引擎的早期版本,以及追溯到netscape navigator.firefox 0.9今后就不要求利用-moz-opacity属性,firefox 3.5（目前利用gecko引擎）已经不在支持这个属性.

　　2、在firefox, safari, chrome和opera下的css透明度
　　以下代码是除了ie外的全部当前浏览器的最简单,最最新的不透明度设置的css语法:

#myelement { opacity: .7; }   

　　上述语法将设置一个元素为70％不透明（或30%透明）.设置opacity:1将使元素不透明,而设置opacity:0将使得元素完好不可见.你 只要记着“opacity”平等于“不透明”就很简单记着了,opacity值越小就越接近透明.
　　opacity属性可以切确地小数点后两位,所以值取“.01”和“.02”实际上是差别的,固然可见度很难被发觉.普通情形下,切确到一位便可以了,取值如“.3”或“.7”.

　　3、ie下的css透明度
　　ie下依旧有别于其他浏览器,并且目前也有三个差别版本的ie在遍及利用,透明度设置是差别的,有时需求额外的css来掌握:

#myelement { filter: alpha(opacity=40); }   

　　上面的css利用专用的filter属性来设置ie6-8透明度.关于ie6和ie7需求注意:为了使得透明设置见效,元素必须是“有筹划”.一个元素可以通过利用一些css属性来使其被筹划,有如width 和 position.关于微软专有的haslayout属性详情,以及若何触发它,欢送参考52css.com相关文档.
　　别的一个设置ie8的css透明度的办法语法以下（注意注释中指出的版本）:

#myelement { filter: progid:dximagetransform.microsoft.alpha(opacity=40);   

/* 第一行在ie6, ie7和ie8下有效 */

-ms-filter: "progid:dximagetransform.microsoft.alpha(opacity=40)";   

/*第二行仅在ie8下有效 */}
　　第一行代码针对当前全部ie版本,第二行仅针对ie8.
　　注意两行代码的差别之处:在第二行代码中,在filter属性前随着-ms-前缀,并且属性值有加引号,这些都是语法所必须的.
　　说实在,有了如前一个例子顶用alpha(opacity=40)的语法来作用于任何版本的ie下的任何有筹划的元素之后,我也不肯定能否还有必要用“progid”的办法.

　　以上是“CSS透明实现办法[网站美工]”的内容，如果你对以上该文章内容感兴趣，你可以看看七道奇为您推荐以下文章：