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

    千次阅读 2015-03-11 11:25:58
    CSS中有一个Alpha滤镜,这个滤镜可以设置目标元素的透明度。还可以通过指定坐标,从而实现各种不同范围的透明度。具体语法如下: {filter: alpha(opacity=#opacity,finishopacity=#finishopacity,style=#style,...
    CSS中有一个Alpha滤镜,这个滤镜可以设置目标元素的透明度。还可以通过指定坐标,从而实现各种不同范围的透明度。具体语法如下:
    {filter: alpha(opacity=#opacity,finishopacity=#finishopacity,style=#style,startx=#startx,starty=#starty,finishx=#finishx,finishy=#finishy)}

    具体参数含义如下:
    opacity 透明度。默认的范围是从0 到 100,他们其实是百分比的形式。也就是说,0代表完全透明,100代表完全不透明。
    finishopacity 是一个可选参数,如果想要设置渐变的透明效果,就可以使用他们来指定结束时的透明度。范围也是0 到 100。
    style   指定透明区域的形状特征:0 代表统一形状,1 代表线形,2 代表放射状,3 代表矩形
    startx  渐变透明效果开始处的 X坐标。
    starty  渐变透明效果开始处的 Y坐标。
    finishx 渐变透明效果结束处的 X坐标。
    finishy 渐变透明效果结束处的 Y坐标。

    以上的参数可以选用,可以只设置一个opacity
    例如:
    {filter:alpha(opacity=50)}
    这个就是半透明的设置,只要把{}中的代码加入到需要设置的模版中的{}的即可,记得与前面的代码之间要用";"间隔,不然设置是无效的

    例如:
    我要设置模版区域背景的颜色(白色)+半透明
    只要在
    .modbox{}
    .modbl{}
    .modbc{}
    .modbr{}
    中都设置background-color:white
    这些就是模版背景设置的ID

    然后再在.modbox,.modbl,.modbc,.modbr{}如果没有这个的话可以自己加一个
    中加入filter : alpha(opacity=80)就可以达到所有模版的背景都是半透明的效果了

    如果希望像我这样只显示blog的背景,别的都全透明的话,那么就在别的模版中加入背景全透明的代码即可
    background:transparent                       这就是背景全透明的代码

    不过这样的话,相关模版的主要区域是透明了,可是底下还会有一条颜色留着的,所以另外还要在
    .modbl{}
    .modbc{}
    .modbr{}
    中也加入背景全透明的代码,这样才能让模版区域完全透明,就像我现在的效果一样

    另外这个参数目前只能用于背景色的设置,背景图片无法设置为半透明

    我把我的背景半透明代码贴出来吧
    .modbox{padding:10px 10px 0 10px;background-color:#FFFFFF;border-left:1px solid #813533;border-right:1px solid #813533}
    .modbl{background:transparent;border-left:1px solid #813533;border-bottom:1px solid #813533;line-height:1px}
    .modbc{background:transparent;border-bottom:1px solid #813533;line-height:1px}
    .modbr{background:transparent;;border-right:1px solid #813533;border-bottom:1px solid #813533;line-height:1px}
    .modbox,.modbl,.modbc,.modbr{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !important;width:100%}

    红色字是关键设置,如果不想设置全透明的话,可以把.modbl{}.modbc{}.modbr{}三个中的background:transparent改成.modbox{}中的background-color:#FFFFFF,当然这里的#FFFFFF你可以换成自己喜欢的颜色,不过为了美观统一,建议这4个的颜色代码最好设置为一样的

    附:#FFFFFF就是white,白色;#000000就是black,黑色
    展开全文
  • CSS背景颜色透明且渐变

    千次阅读 2020-08-28 16:53:55
    Webkit(浏览器内核) background:-webkit-gradient(linear, 0 0, 0 100%, from(rgba(137,227,253,0.9)), to(rgba(20, 63, 181, 0.9))); 效果展示: 各个参数的含义: 1.... 起始位置的颜色 5

    Webkit(浏览器内核)

     background:-webkit-gradient(linear, 0 0, 0 100%, from(rgba(137,227,253,0.9)), to(rgba(20, 63, 181, 0.9)));
    

    效果展示:
    在这里插入图片描述
    各个参数的含义:

    	1. 渐变的类型,linear线性渐变
    	2. 分别对应x,y方向渐变的起始位置(0 0 – 或者left-top)
    	3. 分别对应x,y方向渐变的终止位置(0 100% 或者left-bottom)
    	4. 起始位置的颜色
    	5. 终止位置的颜色
    	6. 透明度最好0.表示,经测试用百分比有时不显示
    

    优秀

    展开全文
  • 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...

    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,0.8)即可

    IE6、7、8 中用IE专属滤镜 filter:Alpha(opacity=x),x 的取值从 0 到 100,如filter:Alpha(opacity=80)
    设置
    *zoom:1;( 激活IE6、7的haslayout属性,让它读懂Alpha )
    filter:Alpha(opacity=50);( 只支持IE6、7、8、9 )

    PS:css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8(会使整体透明)

    参考

    展开全文
  • div css 背景颜色透明度设置

    千次阅读 2015-05-23 21:47:07
    想要设置某个div中的背景颜色透明度使用 div标签的style就可以做到  比如:  方法是:rgba(参数1;参数2;参数3;参数4)  参数1~参数3:三原色(红,绿,蓝)各个颜色的取值范围为0~255,不同的搭配配置出不同的...

    想要设置某个div中的背景颜色的透明度使用 div标签的style就可以做到

        比如: <div style="background-color:rgba(255,255,255,0.2);"></div>

        方法是:rgba(参数1,参数2,参数3,参数4)

                         参数1~参数3:三原色(红,绿,蓝)各个颜色的取值范围为0~255,不同的搭配配置出不同的颜色。

                         参数4:0~1,可以出现小数,表示透明度


    初学者学习经验,希望对大家有用。祝您学习进步,生活安康!

    展开全文
  • 可以使用样式 filter:alpha(opacity=50); 本人在IE8不兼容,使用了filter:alpha(opacity=50); 后问题得到解决
  • 本篇文章就来给大家介绍一下css设置背景颜色透明的方法。在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置。下面我们就来分别看看css中这两种方法实现背景颜色...
  • 本篇文章就来给大家介绍一下css设置背景颜色透明的方法。 在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置。 下面我们就来分别看看css中这两种方法实现背景颜色...
  • 本篇文章就来给大家介绍一下css设置背景颜色透明的方法。在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置。下面我们就来分别看看css中这两种方法实现背景颜色...
  • CSS背景颜色设置透明

    2020-12-25 10:38:31
    CSS背景颜色设置透明方式,例如:background: rgb(250,0,26,0.5);
  • CSS背景设置方法及背景附着 1.背景颜色(color) 语法: background-color:颜色值; 默认值是 transparent 透明的 2.背景图片(image) 语法: background-image:url("图片路径") 小技巧:提倡背景图片后边的地址,...
  • 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设置背景颜色透明度只需要使用rgba(R,G,B,A)即可。A为透明度参数,取值在0~1之间,不可为负值。 下面是学习啦小编给大家整理的一些有关css设置背景颜色透明度的方法,希望对大家有帮助!css设置背景颜色透明度的...
  • css实现背景颜色透明,文字不透明

    千次阅读 2017-07-29 22:07:25
    1.背景颜色用rgba /*CSS*/ .demo{ width: 100px; height: 100px; background: rgba(255,0,0,0.5); color: #000; }这就是背景颜色为红色半透明,文字颜色为黑色不透明的div
  • rgba(0,0,0,0)就可以是背景色完全透明 效果图如下:
  • css:按钮背景颜色透明

    万次阅读 2019-03-26 11:51:47
    其中 background-color:transparent; 设置按钮背景颜色透明 #btn_login{ background-color:transparent; border-style:none; }
  • css 背景透明且渐变且不影响文字颜色 rgba background: linear-gradient(90deg,rgba(255,159,0,0.16), rgba(255,102,0,0.16)); 使用opacity会使得文字的颜色也变得透明
  • css设置遮罩层背景颜色透明度渐变

    千次阅读 2020-08-25 14:34:53
    css设置遮罩层背景颜色透明度渐变 css代码 background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));
  • CSS 背景颜色 background-color属性

    万次阅读 2018-02-17 20:49:12
    背景颜色背景颜色是背景应用中最基础的属性,使用 background-color属性,几乎可以为任何元素定义背景颜色,该属性不能被继承,其默认值是 transparent,即透明背景。也就是说,如果一个元素没有显式定义背景颜色,...
  • CSS背景颜色之奇技淫巧

    万次阅读 2021-03-18 16:04:02
    1.1 背景颜色background-color 1.2 背景图片 background-image 1.3 背景平铺 background-repeat 1.4 背景图片位置 background-position 1.5 背景图像固定 background-attachment 1.6 背景色半透明 rgba
  • filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; background-color:#000;
  • 在写微信小程序的时候,有个需求是按背景颜色background-color要设透明度0.85,让背景图片background-image透一点出来,而且background-color的值是后端传过来的动态数据,背景颜色动态改变,UI同学给的数据全是6位...
  • 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设置背景颜色透明

    千次阅读 2020-01-17 15:49:30
    background-color:transparent;
  • 输入十六进制的颜色值以及透明度,自动在IE的过渡滤镜以及CSS3中的rgba属性之间进行十六进制与十进制的换算。 增加对IE9浏览器中的滤镜取消效果 ★鉴于需要做浏览器的hack,使用了:root来让IE9以前的浏览器不支持...
  • css实现背景颜色透明的两种方法

    千次阅读 2020-06-24 14:58:16
    首先,我们用大家比较熟悉的CSS属性opacity来改变div的背景颜色。 描述: 外面大的div背景颜色为黄色,里面小的div的背景颜色为红色,现在我们需要设置大的div的背景颜色变成半透明状态,我们将opacity的属性值设为...
  • css背景图片加上半透明背景颜色

    千次阅读 2017-04-26 18:57:00
    背景图片加上半透明背景颜色 background: rgba(0, 0, 0, .6) url(../../images/pro-bg.png) no-repeat center center; 转载于:https://www.cnblogs.com/silences/p/6770210.html
  • CSS中如何让背景颜色透明

    千次阅读 2019-09-07 15:47:46
    中(也就是卡片中间的联系方式)添加半透明背景颜色 <article> <img src="chris.jpg" alt="A picture of Chris - a man with glasses, a beard, and a silly wooly hat"> <p>50 My...
  • CSS漂亮的盒子 - 背景颜色透明

    千次阅读 2020-07-31 17:02:21
    在第一个例子中,我们只让背景颜色变得透明,而第二个例子用到opacity属性,让整个元素都变得透明,包含元素中含的内容。 使用opacity把一个元素设置为透明后,将无法再让其子元素变得不那么透明。 body{ ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 38,116
精华内容 15,246
关键字:

css背景颜色透明