<!DOCTYPE html>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>透明度</title>

    <style>

        .c1{

            height: 100px;

            width: 100px;

            background-color: brown;

            color: darkorange;

            opacity: 0.5;

        }

        .c2 {

            height: 150px;

            width: 150px;

            background-color: blueviolet;

            color: rgba(0,123, 211, 0.6);

        }

    </style>

</head>

<body>

<div class="c1">Hello World1</div>

<div class="c2">Hello World!</div>

</body>

</html>

opacity

值 0~1

及改变背景也改变标签里的内容

rbga()

只改变背景

css 透明度的更多相关文章

  1. css的img移上去边框效果及CSS透明度

    css的img移上去边框效果: .v_comment img{ height:36px; height:36px; float:left; padding:1px; margin:2px; borde ...

  2. CSS透明度大汇总

    近年来,CSS不透明算得上是一种相当流行的技术,但在跨浏览器支持上,对于开发者来说,可以说是一件令人头疼的事情.目前还没有一个通用方法,以确保透明度设置可以在目前使用的所有浏览器上有效. 这篇汇总主要 ...

  3. 【总结】CSS透明度大汇总

    近年来,CSS不透明算得上是一种相当流行的技术,但在跨浏览器支持上,对于开发者来说,可以说是一件令人头疼的事情.目前还没有一个通用方法,以确保透明度设置可以在目前使用的所有浏览器上有效. 这篇汇总主要 ...

  4. 使用JavaScript设置和改变CSS透明度

    在Firefox, Safari, Chrome和Opera下的CSS透明度#myElement {opacity: .7;}IE下的CSS透明度IE下照旧有别于其他浏览器,并且目前也有三个不同版本的 ...

  5. css透明度的一些兼容测试

    前言 网站丢给了外包公司来弄,但是老外写css的时候似乎没有考虑到国内的浏览器市场,于是只用了opacity这个属性来写,当IE8-的浏览器访问的时候,浮动层就像一块大黑斑药膏贴在哪里.很显然,婀娜多 ...

  6. css透明度的设置

    Css代码 .transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: ...

  7. css透明度、毛玻璃效果

    透明度: 1.opacity    背景颜色和字体同时透明 2.background:rgba(255,255,255,0.2);   只是背景颜色透明,字体不透明 代码: .info{ backgr ...

  8. 第二季第十一天 html5语义化标签 css透明度

    span不能设置宽高背景 HTML5语义化标签 <section>标签所包裹的是有一组相似的主题的内容,可以用这个标签来实现文章的章节.标签式对话框中的各种标签页等类似的功能. <s ...

  9. css透明度的兼容！！！

    以前总是写透明度的代码,今天弄了个弹出框要求就边框透明,于是有了下边的结论,虽然很多东西不合理了,日后找到更合理在做更新!!! html <div class="new_playerf ...

  10. Css透明度

    全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !importan ...

随机推荐

  1. JavaScript 判断对象中是否有某属性的常用方法

    一.点(.)或方框号([ ]) var obj = { test: '123' } obj.test obj['test'] 二.in 运算符 var obj = { test: '123' } te ...

  2. 2019-2-11-WPF-列表自动换行

    title author date CreateTime categories WPF 列表自动换行 lindexi 2019-02-11 08:55:31 +0800 2019-02-11 08:5 ...

  3. monaco-editor使用

    monaco-editor是一款非常好用的web代码编辑器,那么如何把他加到自己的项目中呢. 1.下载插件 npm install monaco-editor@0.8.3 2.初始化编辑器值 < ...

  4. Microsoft Edge 离线安装包下载

    Microsoft Edge 现已准备就绪 下一版 Microsoft Edge 已准备好进行企业评估. 立即下载离线安装程序.查看管理策略并尝试 Internet Explorer 模式. http ...

  5. 【sublime】Pretty Json插件的安装与配置使用

    一.安装 Package Control  代码安装 从菜单 View - Show Console 或者 ctrl + ~ 快捷键,调出 console.将以下 Python 代码粘贴进去并 ent ...

  6. web服务器调用Servlet的过程

    Servlet程序是由WEB服务器调用,web服务器收到客户端的Servlet访问请求后: Web服务器首先检查是否已经装载并创建了该Servlet的实例对象.如果是,则直接执行第④步,否则,执行第② ...

  7. 算法复杂度之 空间复杂度(Java)

    0.说明 根据算法书上的定义,一个算法的空间复杂度包括算法程序所占用的空间,输入初始数据所占用的空间以及算法执行过程中所需要的额外空间.本文各种结论全部参考过标准文献,本人也进行过验证.验证过程本文不 ...

  8. 选题Scrum立会报告+燃尽图 03

    此作业要求参见:https://edu.cnblogs.com/campus/nenu/2019fall/homework/8680 组长:杨天宇 组员:魏新,罗杨美慧,王歆瑶,徐丽君 组名:组长 第 ...

  9. NET Core 3.1 PATCH HTTP 的使用注意事项

    使用Postman请求示例: 一.在Headers要声明请求类型Content-Type 二.body提交要使用raw,且声明为json格式传输 三.如果有authorization验证还需要带上(如 ...

  10. 【题解】Music Festival(树状数组优化dp)

    [题解]Music Festival(树状数组优化dp) Gym - 101908F 题意:有\(n\)种节目,每种节目有起始时间和结束时间和权值.同一时刻只能看一个节目(边界不算),在所有种类都看过 ...