要使得div的透明度设置,有两种方法。

第一种:使用opacity属性,单词的意思是不透明性,你可以设置它的值,范围是0到1,1为不透明,0为全透明。具体使用如下:

css代码:


#div01{
background:#FFF;
width:500px;
height:500px;
opacity:0.5;
}

 

body里面的代码:


<div id="div01">
asdasjdkahsdkahdklashdlksa
</div>

 

图片效果如下:

注意:这种方法会使得div中的所有内容都变得透明度一样,如果你设置全透明,则div中的字体也会变得全透明从而看不到。

第二种方法:

使用background:rgba(x1, x2, x3, x4);x1,x2,x3分别为颜色的三个基本数据。x4位不透明度,范围为0到1,如果设为1,则不透明,设为0则全透明。

css代码:


#div01{
background:#FFF;
width:500px;
height:500px;
background:rgba(200, 100, 100, 0.5);
}

 

html代码:


<div id="div01">
asdasjdkahsdkahdklashdlksa
</div>

 

注意:这个设置的透明度就只有div的背景透明,而div中的字体不会跟着变。如果你设置为全透明,但是div中的字体却不会变得透明。

 

html学习笔记(一)div的透明设置的更多相关文章

  1. DSP EPWM学习笔记2 - EPWM相关寄存器设置问题解析

    DSP EPWM学习笔记2 - EPWM相关寄存器设置问题解析 彭会锋 本篇主要针对不太熟悉的TZ 故障捕获 和 DB 死区产生两个子模块进行学习研究 感觉TI的寄存器命名还是有一定规律可循的 SEL ...

  2. golang学习笔记6 beego项目路由设置

    golang学习笔记5 beego项目路由设置 前面我们已经创建了 beego 项目,而且我们也看到它已经运行起来了,那么是如何运行起来的呢?让我们从入口文件先分析起来吧: package main ...

  3. python学习笔记——(一)基础设置

    python的学习,今天就开始上开发环境Pycharm,这样以后在调试,使用和学习起来就方便很多. 我用的是JetBrains PyCharm Community Edition 2018.1.1 x ...

  4. OpenXml SDK学习笔记(4):设置文件级别的样式

    观察上一段日记最后的代码: 这里的样式基本可以理解为行内CSS.那么既然有行内的样式,就肯定有外部的样式.那这部分就对应笔记1里说的style.xml文件.这个文件对应的是Document.MainD ...

  5. linux —— 学习笔记(环境变量的设置)

    目录 环境变量概要 与环境变量相关的文件 设置环境变量 注意以及相关 1.环境变量概要 环境变量,简单来说,是储存了环境信息的变量.它可以让你在不指明全部路径的情况下执行某脚本或某应用程序,比如在 l ...

  6. Android(java)学习笔记242:多媒体之设置全屏的方法

    在实际的应用程序开发中,我们有时需要把 Activity 设置成全屏显示,一般情况下,可以通过两种方式来设置全屏显示效果.其一,通过在代码中可以设置,其二,通过manifest配置文件来设置全屏. 其 ...

  7. Android(java)学习笔记82:利用SpannableString设置复合文本

    1. SpannableString设置复合文本: TextView通常用来显示普通文本,但是有时候需要对其中某些文本进行样式.事件方面的设置.Android系统通过SpannableString类来 ...

  8. ObjectARX学习笔记(三十二)----怎样设置AcDbMText对齐方式

    //_T("\\pxql;") 居左 //_T("\\pxqr;") 居右 //_T("\\pxqc;") 居中 //_T("\\ ...

  9. Android(java)学习笔记185:多媒体之设置全屏的方法

    在实际的应用程序开发中,我们有时需要把 Activity 设置成全屏显示,一般情况下,可以通过两种方式来设置全屏显示效果.其一,通过在代码中可以设置,其二,通过manifest配置文件来设置全屏. 其 ...

随机推荐

  1. 解决“System.Data.OracleClient 需要 Oracle 客户端软件 version 8.1.7 或更高版本”的问题

    以server2008为例: 首先确保使用sqlplus能访问数据库. 1.管理工具->计算机管理->本地用户和组->组->administrators属性,添加,高级,立即查 ...

  2. Kibana error " Fielddata is disabled on text fields by default. Set fielddata=true on [publisher] ..."

    Reason of this error:Fielddata can consume a lot of heap space, especially when loading high cardina ...

  3. P2948 [USACO09OPEN]滑雪课Ski Lessons

    题意:Bessie去滑雪,限时T,滑雪场有S节课 每节课开始于$m_i$,长度为$l_i$,可以将Bessie的能力值变成$a_i$(注意是变成不是增加) 有n个滑雪坡,去滑雪需要$c_i$的能力,并 ...

  4. peaks

    给定一个无向图,点有点权边有边权 Q次询问,每次询问从点v开始只经过边权<=x的边能到达所有点中点权第k大值,无解输出-1 N<=1e5,M,Q<=5e5 建立大根kruskal重构 ...

  5. Drop user 报ORA-00600 [KTSSDRP1]

    一客户删除一个数据库用户THH时报错: 说明在获取seg$时没有找到相应的条目,先来解释下这个600错误的参数含义: Arg [a] Tablespace number Arg [b] File nu ...

  6. 编译 OpenWrt/LEDE 基本过程

    说明 前段时间花 110 从闲鱼淘了个 Newifi D1,这个路由的 Soc 是 MT7621AT,性能强劲,于是又开始折腾编译固件了,重新记录一下编译基本过程. 步骤 安装必要的软件包 sudo ...

  7. 使用spyder编译器单步调试python

    1.将需要进行单步调试的函数在脚本中进行调用(十分重要的一步).由于python是解释型语言,在进行单步调试的时候需要告诉系统你使用了这个函数,单步调试才会进入你所需要调式的函数.如下图所示,我们定义 ...

  8. mgo01_window server 2012上安装mongo4.0

    目前mongo最新版为4.0(2018-07-18),下载地址 https://fastdl.mongodb.org/win32/mongodb-win32-x86_64-2008plus-ssl-4 ...

  9. eclipse_project

    转!java web项目 build path 导入jar包,tomcat启动报错 找不到该类 在eclipse集成tomcat开发java web项目时,引入的外部jar包,编译通过,但启动tomc ...

  10. 从c到cpp对static 关键字的总结 需要整理下!!!!!!!!!!!!!!!!!!!!!!

    一个完整的程序,在内存中的分布情况如下: 具体分布图     自己看书去!!!!!1.栈区: 由编译器自动分配释放,像局部变量,函数参数,都是在栈区.会随着作用于退出而释放空间.3.堆区:程序员分配并 ...