精华内容
下载资源
问答
  • 原创:张荣国我们做网页,多数在css定义,说到背景色,一般大家都知道用:background或background-color加颜色码或颜色英文定义比如:背景色为黑色就是:background: #000000;background-color: #000000;background:...

    原创:张荣国

    我们做网页,多数在css定义,说到背景色,一般大家都知道用:background或background-color加颜色码或颜色英文定义

    比如:背景色为黑色就是:

    background: #000000;

    background-color: #000000;

    background: black;

    background-color: black;

    以上都是可以的。

    但随着css的版本越高,我们现在不仅只是设置颜色,还可定义为透明色或半透明等。那么怎么设呢,很简单,代码如下:

    全透明:

    background-color: transparent;

    或 background: transparent;

    都可以了,测一下试试,看是不是全透明了。

    调整透明度代码:

    除了用transparent来设置全透明外,其实,我们也可以用数值代码来设置透明度,看下面:

    background-color: rgba(255,255,255,0.2);

    首先,以上我们以白色为例设置透明度,比如上面的前三个数字是颜色值(相当于#FFFFFF),后面一个就是透明度了。而上面这组举例就是模仿白色全透明的,值为0.2,所以:如果你要调整透明度不要那么透,可加高数值,比如设为0.7的话,大概就只半透多点了。当然,你可以自己调试为你自己喜欢的透明度看看。

    附注:兼容ie8代码:

    以:background: rgba(255,255,255,0.7); 为例

    //需要在元素的样式中添加filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#B3FFFFFF,endColorstr=#B3FFFFFF);

    其中#E6FFFFFF中的B3代表:透明度的计算方法:256*0.7=179.2 取 179 通过计算转换为 十六进制 B3 (16制转换也即HEX用windows计算器的编程模式或程序员模式转换出来)。#FFFFFF是255,255,255的颜色代码。

    展开全文
  • 在网页布局中有时为了网页的整体美观,可能需要将网页中的某些部分设置为背景颜色透明,那么如何设置背景颜色透明呢?本篇文章就来给大家介绍一下css设置背景颜色透明的方法。在css中设置背景颜色透明的方法有两种:...

    在网页布局中有时为了网页的整体美观,可能需要将网页中的某些部分设置为背景颜色透明,那么如何设置背景颜色透明呢?本篇文章就来给大家介绍一下css设置背景颜色透明的方法。

    在css中设置背景颜色透明的方法有两种:一种是通过rgba方式设置,另一种是通过backgroud和opacity设置。

    下面我们就来分别看看css中这两种方法实现背景颜色透明的具体实例

    1、通过backgroud和opacity设置背景颜色透明

    background属性中属性值比较简单,这里就不细说了,大家可以参考css学习手册来了解一下,我们在这里来简单看看opacity属性

    opacity属性参数的"不透明度"是以数字表示,从 0.0 至 1.0 都可以,完全透明是 0.0,完全不透明是

    1.0,换句话说,数字越大代表元素越不透明。参数除了可以使用"不透明度"之外,还有 inherit

    继承父层属性,不过浏览器支援度较差,不建议使用。

    看完了对于两种属性的介绍,下面我们就来看通过backgroud和opacity设置背景颜色透明度的具体实例

    代码如下:

    width:300px;

    height:200px;

    margin:0 auto;

    border:1px solid #ccc;

    background:red;

    opacity:0.2;

    }

    背景颜色透明效果如下:

    934cefc72feaf1ebdad86827c78c5dd6.png

    说明:通过backgroud和opacity设置背景颜色透明度,如果背景上面有文字的话,那么文字也会变成透明,就像下面的效果

    5ebde6f46a9496e7984ce9e616e3a61a.png

    所以要看情况来使用这种方法来设置背景颜色透明。

    2、通过rgba方式设置背景颜色透明

    所谓RGBA颜色,就是RGB三原色加ALPHA。在给背景添加颜色的同时,提供透明度特性。

    用法:background:rgba(R,G, B, A);

    下面我们就来看通过rgba方式设置背景颜色透明度的具体实例:

    背景颜色透明
    .title_div{

    width: 200px;

    height: 200px;

    line-height: 30px;

    text-align: center;

    margin:0 auto;

    background-color:rgba(220,38,38,0.2);

    }

    rgba方式设置背景颜色透明度效果如下:

    0a65437ec11d5eafb6fd91466590068f.png

    说明:通过rgba方式设置背景颜色透明度,可以设置背景颜色透明而文字不透明,但是这种方法的兼容性不好,不兼容ie浏览器

    本篇文章到这里就全部结束了,关于css中更多的知识大家可以参考php中文网css视频教程、css3视频教程、css学习手册和css3学习手册进一步的学习。

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

    万次阅读 2017-07-10 16:51:35
    初学HTML,在学习的过程中偶然发现了背景颜色透明度的设置方法挺有趣,顺便把颜色的设置方法复习总结一下 设置背景颜色有三种方法,分别是:sRGB,十六进制和颜色名; 十六进制: text RGB: text ...

    初学HTML,在学习的过程中偶然发现了背景颜色透明度的设置方法挺有趣,顺便把颜色的设置方法复习总结一下


    设置背景颜色有三种方法,分别是:sRGB,十六进制和颜色名;


    十六进制:

    <p style="background-color:#FFFF00">
    text
    </p>

    RGB:

    <p style="background-color:rgb(255,55,155)">
    text
    </p>

    颜色名:(如:yellow,lightred,black等等)

    <p style="background-color:lightblue">
    text
    </p>


    用RGB值法还可以设置背景颜色的透明度,我一般把它用于调整颜色的浓淡,比起改RGB值或是十六进制来说要便利很多

    <p style="background-color:rgba(255,55,155,0.8)">
    text
    </p>

    background-color后面用rgba取代rgb,a指的是透明度,范围是从0到1,即括号内的第四个值


    斯在web方面的学习刚刚开始,如有谬误之处还望不吝赐教




    展开全文
  • html中如何设置背景和背景颜色透明度

    html中如何设置背景和背景颜色的透明度


           html中设置背景和背景颜色的透明度有两种方式:

           1.通过rgba方式设置

            例如: background:rgba(0,0,0,.5);

            优点:可对任意颜色设置透明度

            缺点:存在兼容性问题:针对IE9以下浏览器不兼容

           2.通过backgroud和opacity设置

            例如:background:#000000;

                       opacity:0.6;

            优点:兼容性好

            缺点:只针对于背景颜色设置透明度。


    展开全文
  • 在网页布局中有时为了网页的整体美观,可能需要将网页中的某些部分设置为背景颜色透明,那么如何设置背景颜色透明呢?本篇文章就来给大家介绍一下css设置背景颜色透明的方法。 在css中设置背景颜色透明的方法有两种...
  • 回答: 你先找个皮肤之后在用用photoshop制作空间大图模块 Photoshop最大的优势就是强大的图片处理功能。... 一、截取背景图片:通过装扮空间设置好你的空间皮肤以后,就可以截取空间背景图片了。 没有抓图软件...
  • div 背景颜色透明度设置

    千次阅读 2013-09-16 14:35:55
    div设置背景颜色透明度    通常我们通过div的style样式属性filter来设置div的背景透明样式。可根据alpha提供的如下参数进行组合控制 filter: Alpha ( enabled=bEnabled , style=...
  • 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 ...
  • 本节向大家爱描述一下如何设置DIV背景颜色透明度,opacityOpacity设置或检索透明渐变的开始透明度,Opacity代表透明度等级,可选值从0到100,0代表完全透明,100代表完全不透明。Style参数指定了透明区域的形状特征...
  • css设置遮罩层背景颜色透明度渐变

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

    千次阅读 2014-06-11 14:32:45
    通常我们通过div的style样式属性filter来设置div的背景透明样式。可根据alpha提供的如下参数进行组合控制: filter: Alpha ( enabled=bEnabled , style=iStyle , opacity=iOpacity , finishOpacity=iFinishOpacity ...
  • div css 背景颜色透明度设置

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

    千次阅读 2020-07-31 17:02:21
    在第一个例子中,我们只让背景颜色变得透明,而第二个例子用到opacity属性,让整个元素都变得透明,包含元素中含的内容。 使用opacity把一个元素设置为透明后,将无法再让其子元素变得不那么透明。 body{ ...
  • 1.通过rgba方式设置 例如: background:rgba(0,0,0,.5); 优点:可对任意颜色设置透明度 缺点:存在兼容性问题:针对IE9以下浏览器不兼容 2.通过backgroud和opacity设置 ...缺点:只针对于背景颜色设置透明度。 ...
  • https://www.o6c.com/web/2016/10/22/379.html
  • 分别对div的四个边框,div里面的填充颜色透明度进行设置,代码如下: 边框颜色调整 input{ margin:100px; border:3px solid #0086EA; background-color: rgba(0,134,234,.3); } div { ...
  • HTML5 颜色透明度

    千次阅读 2018-04-24 17:45:35
    颜色透明度 在Canvas绘图时,可以通过绘制上下文的strokeStyle属性和fillStyle属性来设置图形的描边颜色和填充颜色。默认颜色为不透明的黑色。 strokeStyle属性和fillStyle属性可以被设置为任意有效的CSS...
  • echarts 背景颜色透明

    万次阅读 2017-10-09 14:13:18
    echarts 背景颜色透明,文章整理上传于2017年10月9日 描述:  使用'dark'系列主题初始化控件,控件会自带黑色背景色,与页面整体风格不符合,所以需要将其背景颜色设置为透明. 官网文档: ...
  • jQuery对li设置背景颜色透明度

    千次阅读 2016-09-13 14:36:09
    在用jQuery对页面ul下的li进行mouseover和mouseleave设置背景颜色透明度的设置时,发现当mouseleave时,本身在li里面的字体颜色变淡了。 代码如下: &lt;!DOCTYPE HTML&gt; &lt;html&gt; &...
  • 如何设置背景透明度

    千次阅读 2018-09-17 20:15:25
    设置背景透明度分为两种:一种背景颜色设置的纯色背景;另一种是图片做背景。 【情况一】纯色背景 关键代码:background:rgba(R,G,B,A) RGB--------三原色(red,green,bule) A-------透明度 关于三原色最终...
  • 背景颜色 CSS中设置背景颜色,可以通过两个属性:background-color属性和background属性。 // background-color属性 body { background-color: #bada55; } // background属性 body { background: #bada55; } ...
  • UIView *testView = [[UIView alloc] init]; 第一种 testView = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.5]; ...第二种 testView = [UIColor colorWithWhite:1.0 alpha:0.5];...
  • CSS颜色透明度

    千次阅读 2019-09-30 04:32:20
    一、设置元素背景透明度 opacity可以用来设置元素背景透明度;它需要0~1之间的值 0表示完全透明(opacity:0); 1表示完全不透明(opacity:1); 0.5表示半透明(opacity:0.5); 代码演示: 1 <!...
  • 我想给整个页面做个半透明背景 HTML+CSS+JS 求教
  • 感谢作者感谢原创~ div 背景透明度如何设置一个div的背景透明度 来源:互联网 ...你读DIV背景颜色透明度的设置是否熟悉,这里和大家简单分享一下,通常我们通过DIV的style样式属性filter来设置DIV背
  • 满意答案xiayuwap推荐于 2017.12.15采纳率:51%等级:8已帮助:959人可以设置啊,如图:常见的失败做法最常见的做法...还有就是设置background-color:rgba(),这种方式只能设置背景颜色透明度。正确Action:登陆bod...
  • vue动态绑定背景图片的透明度

    千次阅读 2019-11-08 10:32:00
    在VUE项目中动态设置背景图的透明度时,重点是背景图的透明度,而不是背景颜色透明度,,刚开始怎么也设置不上,写固定值的时候可以,所有就想为什么不能像动态绑定style一样呢??在网上查了大多的帖子,解决的都...
  • DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <title></title> 6 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 47,014
精华内容 18,805
关键字:

html背景颜色透明度