精华内容
下载资源
问答
  • CSS 背景透明度

    2014-02-17 17:21:07
    eg: //设定背景透明度   $(".divQuickQueryShadow").css({ 'opacity': '0.70' });

    eg:

    //设定背景透明度 

     $(".divQuickQueryShadow").css({ 'opacity': '0.70' });

    展开全文
  • css背景透明度

    2015-02-05 13:04:33
    css元素设置透明度,1:opacity:0.5,此方法可以设置透明度,但是在此里面的元素都跟着有了透明度了,2:background-color:rgba(243, 243, 243, 0.75);最后一个参数即为透明度
    css元素设置透明度,1:opacity:0.5,此方法可以设置透明度,但是在此里面的元素都跟着有了透明度了,2:background-color:rgba(243,
     243, 243, 0.75);最后一个参数即为透明度。
    
    展开全文
  • 关于调整透明度,实现透明的css方法如下: css3的opacity:x属性。x的取值为0到1, opacity:0.5表示不透明度为50%; css3的rgba(red,green,blue,alpha),alpha的取值为0到1,也是来表示透明度的。 -------可以实现...

    实现背景透明字体不透明

    原文链接:https://zhuanlan.zhihu.com/p/27535309
    博主在写一个页面的时候遇到透明背景的问题,第一次遇到,记录下来。
    关于调整透明度,实现透明的css方法如下:

    css3的opacity:x属性。x的取值为0到1,

    opacity:0.5表示不透明度为50%

    css3的rgba(red,green,blue,alpha),alpha的取值为0到1,也是来表示透明度的。 -------可以实现实现背景透明字体不透明

    rgba(255,255,255,0.5)表示不透明度为50%

    IE专属滤镜filter:Alpha(opacity=x),x的取值为0到100,如filter:Alpha(opacity=50)表示不透明度为50%

    opacity的兼容性在这里插入图片描述

    opacity属性控制的是整体的透明度,当我设置opacity:0.5的时候,背景图,背景色,文字都会变成半透明属性,所以想实现字体不透明是不行的。

    rgba的兼容性在这里插入图片描述

    rgba(0,0,255,0.5),前三个属性是RGB颜色,最后一个属性表示的是透明度,用rgba(0,0,255,0.5)就可以实现背景透明字体不透明,RGBA不会影响内部的有透明度。

    filter:Alpha的兼容性

    在这里插入图片描述

    展开全文
  • CSS设置背景透明度

    万次阅读 多人点赞 2018-04-16 09:05:53
    实现透明的css方法通常有以下3种方式,以下是不透明度都为80%的写法:css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8css3的rgba(red, green, blue, alpha),alpha的取值从 0 到 1,如rgba(255,255,255,0.8)IE...

    实现透明的css方法通常有以下3种方式,以下是不透明度都为80%的写法:

    css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8

    css3的rgba(red, green, blue, alpha),alpha的取值从 0 到 1,如rgba(255,255,255,0.8)

    IE专属滤镜 filter:Alpha(opacity=x),x 的取值从 0 到 100,如filter:Alpha(opacity=80)

    一、css3的opacity

    兼容性:IE6、7、8不支持,IE9及以上版本和标准浏览器都支持

    使用说明:设置opacity元素的所有后代元素会随着一起具有透明性,一般用于调整图片或者模块的整体不透明度

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>背景透明度</title>
    <style>
    .demo{
      padding: 25px;
      background-color:#000000;
      filter:alpha(opacity:50); opacity:0.5;  -moz-opacity:0.5;-khtml-opacity: 0.5;
    }
    .demo p{
        color: #FFFFFF;
    }
    </style>
    </head>
    <body>    
    
    <div class="demo">
        <p>背景透明,文字也透明</p>
    </div>
    </body>
    </html>

    使用opacity后整个模块都透明了,展现如下:

    那么使用opacity实现《背景透明,文字不透明》是不可取的。

    二、css3的rgba

    所谓RGBA颜色,顾名思意就是R+G+B+A的颜色,再具体点就是red+green+blue+alpha的颜色,翻译一下就是红+绿+蓝+Alpha透明的颜色。

     

    background:rgba(200, 54, 54, 0.5);
    

    其中,表示半透明度的0.5前面的0是可以省掉的,直接.5也是可以的。

    兼容性:IE6、7、8不支持,IE9及以上版本和标准浏览器都支持

    解决IE8浏览器不支持rgba的方法:

     

    background:rgba(0,0,0,0.5); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);

    使用说明:设置颜色的不透明度,一般用于调整background-color、color、box-shadow等的不透明度。

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>css3的rgba</title>
    <style>
    .demo{
      padding: 25px;
      background-color:#000000;/* IE6和部分IE7内核的浏览器(如QQ浏览器)下颜色被覆盖 */
      background-color:rgba(0,0,0,0.2); /* IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂,但解析为透明 */
    }
    .demo p{
        color: #FFFFFF;
    }
    </style>
    </head>
    <body>    
    <div class="demo">
        <p>背景透明,文字也透明</p>
    </div>
    </body>
    </html>

    在background-color中使用rgba,标准浏览器中,背景透明,文字不透明,展现如下:

    那么使用rgba实现背景透明,文字不透明是可取的。

    展开全文
  • css修改背景透明度

    2019-10-09 19:10:10
    css修改背景透明度background-color:rgba(255,255,255,0.0); 修改透明度有很多方法,我这里使用的css background的rgba <div style='width:300px;height: 300px;margin-left: 41%;background: rgba(255,255,255,...
  • css设置背景透明度

    2018-12-19 17:25:55
    &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&...背景透明度&lt;/title&gt; &lt;style&gt; .demo{ padding: 25px; background-color:#000000; /*filter:alpha
  • 背景透明度 1.设置透明背景色rgba background-color:rgba(220,38,38,0.2); 2.通过opacity属性改变透明度 background: #43bff5; opacity:0.2; 背景色透明 background: transparent;
  • css设置背景颜色透明度只需要使用rgba(R,G,B,A)即可。A为透明度参数,取值在0~1之间,不可为负值。 下面是学习啦小编给大家整理的一些有关css设置背景颜色透明度的方法,希望对大家有帮助!css设置背景颜色透明度的...
  • H5 css3背景透明度

    2019-05-07 19:14:00
    背景透明度 Opacity:0-1; 标准浏览器的写法,内容字体跟着一起有透明度。 Background:rgba(255,2,2,.3) 标准浏览器拥有的,但是元素内容不跟着一起透明。 在ie8一下 透明度的写法 filter:alpha(opacity=30); ...
  • css添加背景透明度

    2020-01-07 16:14:53
    如果直接在css中添加opacity 整个页面的透明度都会变,后来借鉴到网上案例, 通过伪元素来添加完美解决。 .home { height: 800px; display: flex; flex-direction: column; flex: 110%; .header_q { z-index: ...
  • css背景透明

    万次阅读 2019-04-15 17:35:00
    css设置div背景透明有两种方法:第一种使用opacity:0~1,这个方法有个缺点,就是内容也会跟着透明;第二种方法就是background-color:rgba(0,0,0,0~1),使用这个方法就只会设置div背景透明,而不会影响到div里的内容...
  • CSS 背景透明度兼容

    2018-03-07 14:27:01
    背景透明度:background: rgba(255, 255, 255, 0.3);但是IE8是没有rgba的,所以需要特殊方法:1) 可以切图,这个比较简单2) 用filterfilter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,...
  • 我想给整个页面做个半透明背景 HTML+CSS+JS 求教
  • css 背景透明

    2019-03-26 09:58:28
    /*给ff来设置透明度的*/  -moz-opacity: 0.8;  opacity:.80;  /*IE设置透明度的*/  filter: alpha(opacity = 80);     毛玻璃效果: filter: url(blur.svg#blur); /* FireFox, Chrome...
  • CSS控制网页的背景透明度

    万次阅读 2018-06-02 20:02:30
    1.实现方法(3种),以不透明度为50%为例 ①CSS3的opacity:X X的取值范围:0~1 如:opacity:0.5; ②CSS3的rgba(red,green,blue,alpha) alpha的取值范围:0~1 如:background:rgba(255,255,255,0.5); ③IE专属...
  • 如何只改变父元素背景透明度不改变子元素透明度
  • CSS背景颜色透明度兼容

    千次阅读 2019-03-25 10:21:00
    chrome( 73.0.3683.86)和Firefox(66.0.1 )中调试 rgb(255,255,255,0.1) 可以只使背景透明 360浏览器,IE11,IE6、7、8 均不行 360浏览器获取与当前IE同版本的内核,所以调好IE即可。 IE11中设置rgba(255,255,255...
  • css 设置背景颜色透明度Introduction: 介绍: Opacity is a very key feature when it comes to the appearance of your images and texts and various other elements. One should be very wise to use opacity ...
  • 本篇文章就来给大家介绍一下css设置背景颜色透明的方法。 在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置。 下面我们就来分别看看css中这两种方法实现背景颜色...
  • HTML 使用CSS 设置透明度Opacity

    千次阅读 2016-06-29 19:04:20
    Html/Css标签透明度效果的实现,在html中,实现半透明背景,在HTML Div+Css编程中,为了实现版透明,通常有3中做法。 第一种是HTML5的透明,在H5中支持透明背景颜色,但遗憾的是,H5中的办透明背景颜色只支持 rgba...
  • div css 背景颜色透明度设置

    千次阅读 2015-05-23 21:47:07
    想要设置某个div中的背景颜色的透明度使用 div标签的style就可以做到  比如:  方法是:rgba(参数1;参数2;参数3;参数4)  参数1~参数3:三原色(红,绿,蓝)各个颜色的取值范围为0~255,不同的搭配配置出不同的...
  • background:rgba(12, 7, 7, 0.45);括号里面的前3个值是rgba的颜色值,0.45是透明度透明度的范围是0~1,0是完全透明,1是完全不透明。
  • 一般情况下,我们可以使用css的opcity属性改变某个元素的透明度,但是其元素下的子元素的透明度也会被改变,即使对子元素重新定义也没有用,例如:
  • div+css教程A标签属性hover背景图片透明度显示 div+css教程A标签属性hover背景图片透明度显示 div+css教程A标签属性hover背景图片透明度显示 div+css教程A标签属性hover背景图片透明度显示
  • 由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example 1 .classname { 2 /* RGBa, 透明度0.6 */ 3 background: rgba(0, 0, 0, 0.6); 4 } ...
  • CSS设置透明度

    千次阅读 2016-11-08 16:35:13
    div{ filter: alpha(opacity=50); -moz-opacity: .5;...}下面是我用到的一个例子,最终效果为:这里底部的小条就是透明的,其样式为: .ck-slideBox { position: absolute; bottom: 0; left: 0;
  • CSS 图像透明度

    2014-08-03 22:29:10
    CSS 图像透明度 CSS 图片库CSS 媒介类型 通过 CSS 创建透明图像是很容易的。 注释:CSS opacity 属性是 W3C CSS 推荐标准的一部分。 亲自试一试 - 实例 创建透明图像 - Hover 效果在本例中,当用户...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 42,227
精华内容 16,890
关键字:

css背景透明度