如何实现背景透明,文字不透明,兼容所有浏览器?
我们平时调整的不透明度如图所示:
实现透明的css方法通常有以下3种方式,以下是不透明度都为80%的写法:
css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8 css3的rgba(red, green, blue, alpha),alpha的取值从 0 到 1,如rgba(255,255,255, 0.8 ) IE专属滤镜 filter:Alpha(opacity=x),x 的取值从 0 到 100,如filter:Alpha(opacity=80)css的 opacity
兼容性:IE6、7、8不支持,IE9及以上版本和标准浏览器都支持,如图所示:
使用说明:设置opacity元素的所有后代元素会随着一起具有透明性,一般用于调整图片或者模块的整体不透明度
背景透明,文字不透明 *{ padding: 0; margin: 0;}body{ padding: 50px; background: red;}.demo{ width:200px; margin:0 auto; padding: 25px; background-color:#000000; opacity: 0.2;}.demo p{ color: #FFFFFF;}
背景透明,文字也透明
查看更多关于CSS实现背景透明,文字不透明,兼容所有浏览器_html/css_WEB-ITnose的详细内容...
声明:本文来自网络,不代表【好得很程序员自学网】立场,转载请注明出处:http://haodehen.cn/did109546