好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

CSS实现背景透明,文字不透明,兼容所有浏览器_html/css_WEB-ITnose

如何实现背景透明,文字不透明,兼容所有浏览器?

我们平时调整的不透明度如图所示:

实现透明的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的详细内容...

  阅读:35次