<!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. P1076 单词覆盖还原

    题目描述 一个长度为 \(l(3\le l\le 255)\) 的字符串中被反复贴有 boy 和 girl 两单词,后贴上的可能覆盖已贴上的单词(没有被覆盖的用句点表示),最终每个单词至少有一个字符没 ...

  2. SpringBoot使用Junit测试 防止事物自动回滚

           问题:我在测试类中的save方法测试成功通过,但数据库没有插入数据 测试方法如下: @Test @Transactional // @Rollback(false) public voi ...

  3. git无密码push

    近来项目中调研,jupyterlab和git的整合内容,git server我使用的gitbucket和bitbucket.(项目要求使用bitbucket,看错一个字母下载了两个镜像) gitbuc ...

  4. mybatis的核心配置文件

    <?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE configurationPUBLIC &q ...

  5. Java面试思路

    一.javaSE基础 1.java IO流 2.java NIO 3.java集合 4.java注解 5.java泛型 6.java反射 7.java多线程 8.常用String.数组.日期操作 二. ...

  6. hexo+next 详细搭建

    安装node node下载地址:http://nodejs.cn/download/ 具体安装方法,这里不做详写 安装完成可以通过node -v 查看安装是否生效和node的版本 我这里使用的是v10 ...

  7. C# event 事件-2

    本次是对第一篇事件随笔的补充笔记,涉及题目依然使用上一篇的习题.上一篇地址:https://www.cnblogs.com/FavoriteMango/p/11685702.html 1.事件的定义 ...

  8. Netty堆外内存泄漏排查，这一篇全讲清楚了

    上篇文章介绍了Netty内存模型原理,由于Netty在使用不当会导致堆外内存泄漏,网上关于这方面的资料比较少,所以写下这篇文章,专门介绍排查Netty堆外内存相关的知识点,诊断工具,以及排查思路提供参 ...

  9. 从零开始のcocos2dx生活（七）ParticleSystem

    CCParticleSystem是用来设置粒子效果的类 1.粒子分为两种模式:重力模式 和 半径模式 重力模式独占属性: gravity 重力方向,Vec2类型,可以分别指定不同方向的重力大小 spe ...

  10. 【题解】[HNOI2015]菜肴制作(贪心+topo序)

    [题解][HNOI2015]菜肴制作(贪心+topo序) 题意:请你构造一个排列\(p[i]\)使得对于数组\(arc[i]=p[i]\)的字典序最小,并且对于给定的有序数对\((u,v)\)保证你给 ...