<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>背景透明，文字不透明</title>

<style>

*{

    padding: ;

    margin: ;

}

body{

  padding: 50px;

  background: #34735D;

}

h1 {

    position: absolute;

    left: 400px;

}

.test {

  padding: 25px;

  background-color: rgba(,,,0.5);/* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */

}

.test p {

    font-size: 20px;

    font-weight: ;

     color: #fff;

}

@media \0screen\,screen\ {/* 只支持IE6、7、8 */

  .test{

    background-color:#;

    filter:Alpha(opacity=);

    position:static;  /* IE6、7、8只能设置position:static(默认属性) ，否则会导致子元素继承Alpha值 */

    *zoom:; /* 激活IE6、7的haslayout属性，让它读懂Alpha */

  }

  .test p {

    position: relative;/* 设置子元素为相对定位，可让子元素不继承Alpha值 */

  }

}

</style>

</head>

<body>

<h1>这里是标题，会当做背景显示</h1>

<div class="test">

    <p>背景透明，文字不透明</p>

</div>

</body>

</html>

CSS实现背景透明，文字不透明的更多相关文章

  1. css实现背景半透明文字不透明的效果

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. css背景透明文字不透明

    测试背景透明度为0.3.文字不透明: background-color: #000; /* 一.CSS3的opacity */ opacity: 0.3; /* 兼容浏览器为:firefox,chro ...

  3. css实现背景透明文字不透明

    设置元素的透明度:  -moz-opacity:0.8; /*在Firefox中设置元素透明度  filter: alpha(opacity=80); /*ie使用滤镜设置透明   但是当我们对一个标 ...

  4. css3背景透明文字不透明

    在 FF/Chrome 等较新的浏览器中可以使用css属性background-color的rgba轻松实现背景透明,而文字保持不透明.而IE6/7/8浏览器不支持rgba,只有使用IE的专属滤镜fi ...

  5. 背景透明文字不透明的最佳方法兼容IE(以背景黑色透明度0.5为例)

    以背景黑色,透明度0.5举例为大家详细介绍下关于背景透明,文字不透明的最佳方法同时兼容IE,具体实现如下,感兴趣的朋友可以参考下哈希望对大家有所帮助 以背景黑色,透明度0.5举例 非IE:backgr ...

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

    最近遇到一个需求,如下图,input框要有透明效果 首先想到的方法是CSS3的 opacity属性,但事实证明我想的太简单了 这个属性虽然让input框有透明效果,同时文字和字体图标也会有透明效果,导 ...

  7. div半透明背景，文字不透明

    background: rgba(255, 255, 255, 0.8) !important; /* IE无效,FF有效 */ background: #fff; filter: alpha(opa ...

  8. [小技巧]兼容IE6的纯CSS背景半透明文字不透明

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. html 背景透明文字不透明

    .alpha{ width: 100px; height: 100px; color: #fff; background: rgba(0, 0, 0, .3); filter: progid:DXIm ...

  10. CSS实现Div透明，而显示在上面的文字不透明，但也可看到显示在下面的图片内容

    CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容,DiV透明其实挺简单,主要是为background定义opacity属性,一般这个是最大值是1,数值越接近1,则越不透明 ...

随机推荐

  1. 【FCS NOI2018】福建省冬摸鱼笔记 day2

    第二天. 同学还是不带本子记笔记.dalao. 第二天:图论,讲师:@ExfJoe 全程划水,前面都讲水算法[虽然我可能已经忘记了]什么最短路,Tarjan,最小生成树,2SAT,差分约束啥的,我现在 ...

  2. MVVM模式的命令绑定

    命令绑定要达到的效果 命令绑定要关注的核心就是两个方面的问题,命令能否执行和命令怎么执行.也就是说当View中的一个Button绑定了ViewModel中一个命令后,什么时候这个Button是可用的, ...

  3. 使用MongoDB命令工具导出、导入数据

    Windows 10家庭中文版,MongoDB 3.6.3, 前言 在前面的测试中,已经往MongoDB的数据库中写入了一些数据.现在要重新测试程序,数据库中的旧数据需要被清理掉,可是,又想保存之前写 ...

  4. js中this揭秘

    前端面试题中经常会考this指向问题,初学者通常都会晕头转向,不知所以然.今天我就来讲讲js中this指向问题. this指向大概分为5种情况,记住这6个规律,基本上面试题都能解决. 通过圆括号直接调 ...

  5. 使用html+css+js实现日历与定时器，看看今天的日期和今天剩余的时间。

    使用html+css+js实现日历与定时器,看看今天的日期和今天剩余的时间. 效果图: 哎,今天就又这么过去了,过的可真快 . 代码如下,复制即可使用: <!DOCTYPE html> & ...

  6. Codeforces 807C - Success Rate(二分枚举)

    题目链接:http://codeforces.com/problemset/problem/807/C 题目大意:给你T组数据,每组有x,y,p,q四个数,x/y是你当前提交正确率,让你求出最少需要再 ...

  7. Python学习笔记：lambda表达式

    lambda表达式:通常是在需要一个函数,但又不想去命名一个函数的时候使用,即匿名函数. 示例如下: add = lambda x,y : x+ y add(1,2) # 结果为3 1.应用在函数式编 ...

  8. MySQL 连接本地数据库、远程数据库命令

    一.MySQL 连接本地数据库,用户名为“root”,密码“123”(注意:“-p”和“123” 之间不能有空格) C:/>mysql -h localhost -u root -p123 二. ...

  9. USACO 6.5 All Latin Squares

    All Latin Squares A square arrangement of numbers 1 2 3 4 5 2 1 4 5 3 3 4 5 1 2 4 5 2 3 1 5 3 1 2 4 ...

  10. 易普优高级计划排程Light版助力中小企业实现精益化计划

    易普优高级计划排程Light版助力中小企业实现精益化计划 一.业务与排产需求 根据统计,目前中小企业已经占到我国工业企业总数的95%以上,对中国GDP贡献超过60%,税收超过了50%,提供了70%的进 ...