pc端背景透明,内容不透明

1.

<div class="demo">   <span>背景透明,文字不透明</span>
</div>

2.

*{   padding: 0;   margin: 0;}

body{  padding: 50px;  background: url(img/bg.png) 0 0 repeat;}

.demo{  padding: 25px;  background-color: rgba(0,0,0,0.5);/* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */}.demo span{  color: #FFFFFF;}@media \0screen\,screen\9 {/* 只支持IE6、7、8 */  .demo{    background-color:#000000;    filter:Alpha(opacity=50);    position:static; /* IE6、7、8只能设置position:static(默认属性) ,否则会导致子元素继承Alpha值 */    *zoom:1; /* 激活IE6、7的haslayout属性,让它读懂Alpha */  }  .demo span{    position: relative;/* 设置子元素为相对定位,可让子元素不继承Alpha值 */  }  }
时间: 2024-10-25 19:27:20

pc端背景透明,内容不透明的相关文章

兼容IE、Firefox的背景半透明内容不透明设置

首先要说明的是背景是内容的祖先元素.如果是兄弟节点那就没有必要记录这篇文章了. 记录一下,知其然也知其所以然. IE8-特点: 1.不支持"opcity:0.5;"这种写法,只支持"filter:alpha(opacity=50)". 2.如果背景元素拥有css属性设置了z-index的值(除默认值auto外),则内容会随着背景元素一起半透明 3.如果背景元素的内容元素本身或其祖先节点(这些祖先节点是背景元素的后代节点)没有设置css定位属性position:rel

div背景透明内容不透明与0.5PX边框兼容设置

1.问题:设置 border-width:0.5px;  并兼容安卓和苹果移动端.  兼容:苹果IOS的 safari 支持浮点数边框,安卓浏览器不支持,会四舍五入到1px.不同浏览器效果额不同  解决方案:设置2层嵌套的div,最外层的用来定位,保障我们设置的内容不会脱离原先的文档流.   里层设置两个div,一个用来书写内容,一个用来专门设置边框 HTML代码 : <!-- position_box用来定位,控制该区域在原文档流中的位置 --> <div class="po

通过IE私有滤镜让IE6 7 8支持背景透明,内容不透明效果。

CSS3已经支持背景rgba的rgba透明度,这一方法可以避免元素内容也随背景一起变透明(详情请阅http://www.cssha.com/css3-new-knowledge-student).但是这一属性在低于IE9的版本中却不被支持,我们可以通过IE私有滤镜来实现背景透明效果.rgba参数格式:(red,green.,blue,alpha),alpha值0-1.ie滤镜参数#3363370b,前两位为16进制透明度,比如说值是上面用到的0.2,那么就是0.2×255=51,再转换成16进制

关于实现背景透明文字不透明的解决方案

最近在做项目的时候遇到实现背景透明文字不透明的解决方法要求的兼容性是ie8+ 1.大家豆知道background:rgba(),可以实现背景透明文字不透明但是ie8 不支持background:rgba(); 如果不考虑ie 8 我们可以直接rgba就解决了 2.如果考虑ie8 我的做法是,先说我的做法,再说别人的做法. 3.我的做法是按照设计稿切切一张1px*1px的png透明图片然后background:url(toumingdu.png);这样就会平铺过去,可以很快实现背景透明文字不透明,

CSS3实现背景透明文字不透明

最近遇到一个需求,如下图,input框要有透明效果 首先想到的方法是CSS3的 opacity属性,但事实证明我想的太简单了 这个属性虽然让input框有透明效果,同时文字也会有透明效果,导致文字不清晰,如下图 于是我开始思考其它方式,最后想到了通过透明背景图来实现 背景图虽然能够解决问题,但会造成空div,并且还需要设置定位 感觉把简单的事情变得复杂了,我始终认为有更简单的方法 最后终于被我找到了完美解决的方法--用CSS3的 rgba 来设置 background-color: rgb(25

将UITableView背景颜色设置为透明的方法

最近在使用UITableView做页面的时候,被一个问题困扰很久,如何将UITableView的页面的背景颜色设置为透明, 显示效果为:每个TableView的Cell只显示图片,lbl等内容,但背景色为透明,即显示为其所在的的UIView的背景色. 在百度上搜索了很多方法都无效,今天终于解决: 一直在纠结于UITableView和UITableViewCell的背景色设置为透明,但无效,最终发现,需要设置一下UITableViewCell的 一个lableText的backgroundcolo

vc实现透明位图,透明背景

vc实现透明位图,透明背景 我们在进行程序的界面设计时,常常希望将位图的关键部分,也既是图像的前景显示在界面上,而将位图的背景隐藏起来,将位图与界面很自然的融合在一起,本文介绍了透明位图的制作知识,并将透明位图在一个对话框中显示了出来. 一.实现方法 绘制"透明"位图是指绘制某一位图中除指定颜色外的其余部分,我们称这种颜色为"透明色".通过将位图的背景色指定为"透明色",在绘制时,不绘制这部分背景,而仅绘制图像,这样就可以将位图中图像透明地绘制到

背景色透明,内容不透明,适用所有浏览器(转)

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <meta http-equiv=&quo

div半透明背景,文字不透明

1 background: rgba(255, 255, 255, 0.8) !important; /* IE无效,FF有效 */ 2 3 background: #fff; 4 5 filter: alpha(opacity=60); 在需要不透明文字的元素样式上添加样式:position:relative; div半透明背景,文字不透明