Home  >  Article  >  Web Front-end  >  求css背景透明与文字不透明的方法_html/css_WEB-ITnose

求css背景透明与文字不透明的方法_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:50:181815browse

求背景图片透明,文字不透明的方法,兼容各种浏览器最好。

目前知道两种。测试浏览器chrome ie11
方法一(目前最满意,只是不支持图片)
background:rgba(255,255,255,0.5) !important;
 两者都支持
方法二(span在div中)
div{
filter:alpha(opacity=20);
opacity:0.2;,
}
span{
  position:absolute;
}
ie11支持,chrome不支持!!


回复讨论(解决方案)

把背景图片本身制作成半透明的png格式不就得了

要分工 

一个层做背景 透明
一个层显示文字

然后2个层 放在一个div里面

http://leegorous.net/tools/bg-alpha.html
用这个工具生成兼容代码,高级浏览器用alpha透明,ie用filter透明。

把背景图片本身制作成半透明的png格式不就得了


通过css如果可以改就可以更个性化了。

http://leegorous.net/tools/bg-alpha.html
用这个工具生成兼容代码,高级浏览器用alpha透明,ie用filter透明。


如果只是背景色的话没问题,我现在问的是背景图片。
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn