实现div背景透明的两种方法


1.使用opacity属性

background-color:#000;
opacity: 0.5;

这样做可以设置div内部所以区域的透明度,但是也会影响里面的文字,效果图:

2、只改变背景透明度,不改变其中文字、图片等透明度的方法

background-color: rgba(0,0,0,0.5);

其中前三位数是设置背景颜色,取值范围是0~255,全部为零代表黑色,全部为255代表白色。
rgba即红色、绿色、蓝色、透明度(英语:Red, Green, Blue、Alpha)。

红色(R)0 到 255 间的整数,代表颜色中的红色成分。。
绿色(G)0 到 255 间的整数,代表颜色中的绿色成分。
蓝色(B)0 到 255 间的整数,代表颜色中的蓝色成分。
透明度(A)取值 0~1 之间, 代表透明度。
效果图:

设置div背景透明的两种方法的更多相关文章

  1. CSS实现自适应不同大小屏幕的背景大图的两种方法(转自简书)

    CSS实现自适应不同大小屏幕的背景大图的两种方法 一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块 ...

  2. 华硕笔记本怎么设置u盘启动(两种方法)

    华硕笔记本怎么设置u盘启动(两种方法) 华硕笔记本怎么设置u盘启动.我想用U盘安装系统但是 我不知道如何设置U盘启动,那么该如何设置呢?下面和大家分享一下我的经验,希望能够帮到大家.如果你的系统是预装 ...

  3. 设置div背景透明的CSS样式

    div背景透明样式: 样式代码: .alert{filter:alpha(opacity=100); /* IE */ -moz-opacity:1.0; /* Moz + FF */ opacity ...

  4. 使IE6下PNG背景透明的七种方法任你选

    原文地址:http://blog.csdn.net/mosliang/article/details/6760028 相信如何解决png在ie6下透明的问题困扰了很多人.为了追求更好的页面效果,很多人 ...

  5. Android 通过代码设置radiobutton不同方位图标的两种方法

    更换radiobutton中的图片在xml中很好设置,但对于初学者如何在代码中设置还是不容易找的.没法子,通过看原版api找到两个方法,setCompoundDrawables和setCompound ...

  6. 通过代码设置radiobutton不同方位图标的两种方法

    更换radiobutton中的图片在xml中很好设置,但对于初学者如何在代码中设置还是不容易找的.没法子,通过看原版api找到两个方法,setCompoundDrawables和setCompound ...

  7. 【笔记】让DIV水平垂直居中的两种方法

    今天写的了百度前端学院春季班的任务:定位和居中问题  由于距离上次学习CSS有点久远了,加上以前木有记笔记的习惯,方法忘得只剩下一种,今天通过网上查阅资料总结了以下两种简单的方法让DIV水平垂直居中. ...

  8. 设置emacs启动窗口的两种方法

    1. 设置位置和大小 ;;设置窗口位置为屏库左上角(0,0) (set-frame-position (selected-frame) 0 0) ;;设置宽和高 (set-frame-width (s ...

  9. Vue设置路由跳转的两种方法: <router-link :to="..."> 和router.push(...)

    一.<router-link :to="..."> to里的值可以是一个字符串路径,或者一个描述地址的对象.例如: // 字符串 <router-link to= ...

随机推荐

  1. hive向mysql导入数据sqoop命令出错

    报错信息: java.lang.Exception: java.io.IOException: java.lang.ClassNotFoundException: info at org.apache ...

  2. 学习java 7.11

     学习内容: 泛型定义格式:<类型> 优点:把运行时期的问题提前到编译期间:避免了强制类型转换   泛型方法:public class Fanxing { public <T> ...

  3. Hbase(二)【shell操作】

    目录 一.基础操作 1.进入shell命令行 2.帮助查看命令 二.命名空间操作 1.创建namespace 2.查看namespace 3.删除命名空间 三.表操作 1.查看所有表 2.创建表 3. ...

  4. [php安全]原生类的利用

    php原生类的利用 查看原生类中具有魔法函数的类 $classes = get_declared_classes(); foreach ($classes as $class) { $methods ...

  5. 查看linux系统CPU和内存命令

    cat /proc/cpuinfo查看linux系统的CPU型号.类型以及大小,如下图所示.   通过greap命令根据Physical Processor ID筛选出多核CPU的信息.   cat ...

  6. mysql 将A表的a字段赋值给B表的b字段

    A.B为2个不同的表,将A表的a字段赋值给B表的b字段:update B set b = (select a from A where A.id = B.id) where B.b is null 注 ...

  7. Spring Boot Actuator:健康检查、审计、统计和监控

    Spring Boot Actuator可以帮助你监控和管理Spring Boot应用,比如健康检查.审计.统计和HTTP追踪等.所有的这些特性可以通过JMX或者HTTP endpoints来获得. ...

  8. 观察者模式之spring事件机制

    ddsspring中的事件机制使用到设计模式中的观察者模式 ,观察者模式有两个概念,1.观察者.被观察者.2.被观察者做出相应得动作,观察者能接收到.不分析设计模式,学习下spring中的事件机制实际 ...

  9. 【Java】面向类与对象

    一.面向对象 对象封装:私有变量+公共方法 方法与构造方法 this变量 Animal.java public class Animal { String name; int age; void mo ...

  10. 安霸pipeline简述之rgb域的处理

    RGB域处理模块的详细介绍: RGB域的处理主要是demosaic,color_correction,tone_curve(类似于gamma曲线).   Demosaic:此模块将bayer Patt ...