taobao.fm 这个域名正在出售中,>Mail:www@zhubangbang.com

以后的文章大多更新在,朱邦邦的WEB前端开发博客

分类 CSS 下的文章

背景透明文字不透明(兼容各浏览器),rgba兼容到ie8的,最简单粗暴的写法

今天工作中遇到一个需求,

是要实现“背景透明文字不透明”;

我开始是新建一个兄弟元素做的,后来想着用伪元素来做;

但是前端leader说伪元素也不好,让试试rgba,然后网上搜兼容IE方法;

看到网上很多种写法,都很麻烦,

很多教程和帖子是这种写法;

background:rgba(255, 255, 255, 0.6)!important;
filter:Alpha(opacity=60); background:#fff;

然后再这个子元素下面再让字体凸显出来;

比如;

.content { width:180px; height:260px; margin:0px auto; padding:30px 30px;background:rgba(255, 255, 255, 0.6)!important;
filter:Alpha(opacity=60); background:#fff; /* 使用IE专属滤镜实现IE背景透明*/ }
.content p{ position:relative;} /*实现IE文字不透明*/

~ 阅读剩余部分 –

面试遇到一个z-index的题目;网上说的问题和自己写的好像效果不一样;

搜了下东西;

看到有这么一句话;

当子层和父层都定义了z-index的属性的时候,z-index值以父层的z-index为准,这个是web前端应该谨记的一点,这个在实际切图中经常会碰到这个问题,下次在碰到这种问题就不会搞错了。

ps:需要使用子层z-index属性的时候,那就要删除子层父层上的z-index属性,如果要用父层z-index属性,那么子层z-index不需要定义,因为定义也是无效的。

但是写的时候发现,好像z-index最大的还是显示完; 阅读剩余部分 –