<!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. Vue.js 学习笔记 第7章 组件详解

    本篇目录: 7.1 组件与复用 7.2 使用props传递数据 7.3 组件通讯 7.4 使用slot分发内容 7.5 组件高级用法 7.6 其他 7.7 实战:两个常用组件的开发 组件(Compon ...

  2. dotnet core 发布只有一个 exe 的方法

    在 dotnet core 发布的时候,会使用很多文件,这样发给小伙伴使用的时候不是很清真,本文告诉大家一个非官方的方法通过 warp 将多个文件打包为一个文件 和之前相同的方式发布一个 dotnet ...

  3. C# 发送电子邮件（smtp）

    相关享目托管在github: https://github.com/devgis/CSharpCodes

  4. .Net Core 3.0 发布为单独的可执行文件

    dotnet publish -r win-x64 -c Release /p:PublishSingleFile=true /p:PublishTrimmed=true

  5. 修改Samba密码后无法登录

    Samba修改用户名密码后,无法登陆 之后每次进去都是以这样的username和passwd进去的,如何才能使用其他的用户来重新登录samba server呢? 首先使用在开始菜单里面输入cmd: 进 ...

  6. 第二阶段：1.流程图：9.excel绘制甘特图

    后面的框都是日期 可以以一个月为周期计算或者周或者... 因为产品经理应该严格把控产品的时间 因此甘特图特别有必要 注意:任务拆解的越细 把控度越强 然后对格式进行设置 注意时间下面可以用颜色填充来表 ...

  7. 解析GMT+N时区，返回日期类型

    涉及到正则表达式,时区转换. /** * * 按格式 yyyy-MM-dd HH:mm:ss 以指定GMT时区进行解析,返回对应的当前系统时区当地时间. * @param dateString  格式 ...

  8. flask修改数据库字段的类型和长度

    flask修改数据库字段的类型和长度 ​ 在将models中的字段的db.String(256)修改为db.String(1024)后,执行migrate和upgrade操作后,发现数据库并没有更新, ...

  9. saltstack的配置使用

    介绍 认证管理,使其可以用于编配, 远程执行, 配置管理等等.部署轻松,在几分钟内可运行起来,扩展性好,很容易管理上万台服务器,速度够快,服务器之间秒级通讯. 号称世界上最快的消息队列ZeroMQ使得 ...

  10. k8s集群———单master节点2node节点

    #部署node节点 ,将kubelet-bootstrap用户绑定到系统集群角色中(颁发证书的最小权限) kubectl create clusterrolebinding kubelet-boots ...