现在的位置: 首页 > 综合 > 正文

CSS背景透明但文字不透明(支持全部浏览器)

2011年08月02日 ⁄ 综合 ⁄ 共 724字 ⁄ 字号 评论关闭

解决方案:

 

①两个叠在一起的层

 

②用半透明的png(推荐)

  

背景透明但文字不透明

 

 

 

 

 

 

 

 

支持IE、Firefox、Chrome、Opera

支持所有浏览器

<html> 
<title>透明</title>
<head>
<style>
#container 
{
    color
: #154BA0;
    background
: #ff0000;
    filter
: Alpha(Opacity=10, Style=0);
    opacity
: 0.10;
    position
: absolute;
    height
: 200px;
    width
:500px;
    z-index
:20;
}

#text {
    position
: absolute;
    height
: 200px;
    width
:500px;
    text-align
:center;
    z-index
:30;
}
</style>
</head>
<body >
<div id="container"></div>
<div id="text">背景半透明但文字不透明</div>
</body>
</html> 

抱歉!评论已关闭.