设置div背景透明的两种方法
实现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背景透明的两种方法的更多相关文章
- CSS实现自适应不同大小屏幕的背景大图的两种方法(转自简书)
CSS实现自适应不同大小屏幕的背景大图的两种方法 一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块 ...
- 华硕笔记本怎么设置u盘启动(两种方法)
华硕笔记本怎么设置u盘启动(两种方法) 华硕笔记本怎么设置u盘启动.我想用U盘安装系统但是 我不知道如何设置U盘启动,那么该如何设置呢?下面和大家分享一下我的经验,希望能够帮到大家.如果你的系统是预装 ...
- 设置div背景透明的CSS样式
div背景透明样式: 样式代码: .alert{filter:alpha(opacity=100); /* IE */ -moz-opacity:1.0; /* Moz + FF */ opacity ...
- 使IE6下PNG背景透明的七种方法任你选
原文地址:http://blog.csdn.net/mosliang/article/details/6760028 相信如何解决png在ie6下透明的问题困扰了很多人.为了追求更好的页面效果,很多人 ...
- Android 通过代码设置radiobutton不同方位图标的两种方法
更换radiobutton中的图片在xml中很好设置,但对于初学者如何在代码中设置还是不容易找的.没法子,通过看原版api找到两个方法,setCompoundDrawables和setCompound ...
- 通过代码设置radiobutton不同方位图标的两种方法
更换radiobutton中的图片在xml中很好设置,但对于初学者如何在代码中设置还是不容易找的.没法子,通过看原版api找到两个方法,setCompoundDrawables和setCompound ...
- 【笔记】让DIV水平垂直居中的两种方法
今天写的了百度前端学院春季班的任务:定位和居中问题 由于距离上次学习CSS有点久远了,加上以前木有记笔记的习惯,方法忘得只剩下一种,今天通过网上查阅资料总结了以下两种简单的方法让DIV水平垂直居中. ...
- 设置emacs启动窗口的两种方法
1. 设置位置和大小 ;;设置窗口位置为屏库左上角(0,0) (set-frame-position (selected-frame) 0 0) ;;设置宽和高 (set-frame-width (s ...
- Vue设置路由跳转的两种方法: <router-link :to="..."> 和router.push(...)
一.<router-link :to="..."> to里的值可以是一个字符串路径,或者一个描述地址的对象.例如: // 字符串 <router-link to= ...
随机推荐
- ceph对象存储场景
安装ceph-radosgw [root@ceph-node1 ~]# cd /etc/ceph # 这里要注意ceph的源,要和之前安装的ceph集群同一个版本 [root@ceph-node1 c ...
- Hbase(二)【shell操作】
目录 一.基础操作 1.进入shell命令行 2.帮助查看命令 二.命名空间操作 1.创建namespace 2.查看namespace 3.删除命名空间 三.表操作 1.查看所有表 2.创建表 3. ...
- cookie规范(RFC6265)翻译
来源:https://github.com/renaesop/blog/issues/4 RFC 6265 要点翻译 1.简介 本文档定义了HTTP Cookie以及HTTP头的Set-Cookie字 ...
- 容器之分类与各种测试(三)——queue
queue是单端队列,但是在其实现上是使用的双端队列,所以在queue的实现上多用的是deque的方法.(只要用双端队列的一端只出数据,另一端只进数据即可从功能上实现单端队列)如下图 例程 #incl ...
- Oracle中常用的系统表
1.dba开头的表 dba_users 数据库用户信息 dba_segments 表段信息 dba_extents 数据区信息 dba_objects 数据库对象信息 dba_tablespaces ...
- Linux基础命令---put上传ftp文件
put 使用lftp登录ftp服务器之后,可以使用put指令将文件上传到服务器. 1.语法 put [-E] [-a] [-c] [-O base] lfile [-o rfi ...
- 渐进式web应用 (PWA)
PWA(渐进式 Web 应用)运用现代的 Web API 以及传统的渐进式增强策略来创建跨平台 Web 应用程序. PWA的特点: Discoverable, 内容可以通过搜索引擎发现. Instal ...
- 【Java 与数据库】JDBC中日期时间的处理技巧
JDBC中日期时间的处理技巧 详谈Java.util.Date和Java.sql.Date 基础知识 Java中用类java.util.Date对日期/时间做了封装,此类提供了对年.月.日.时.分.秒 ...
- springMVC WebApplicationInitializer 替代web.xml 配置Servlet 之原理
Servlet 3.0之前 ,xml 配置 在过去搭建spring + springMCV ,首先第一步要做的是什么 ,就是要配置web.xml 文件 ,把springMVC 中的Servlet 加 ...
- 使用Booststrap布局网页页面
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="utf-8&qu ...