精华内容
下载资源
问答
  • 我们经常会使用到背景图片,但有时候需要把背景图片设置一个半透明的效果,那么就需要以下的CSS了。...width:100%}注:代码应用的式CSS中的Alpha滤镜,这个滤镜可以设置目标元素的透明度。还可以通过指定坐标,从...

    我们经常会使用到背景图片,但有时候需要把背景图片设置一个半透明的效果,那么就需要以下的CSS了。这是一个CSS滤镜达到的效果,应用十分广泛。

    .modbr{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto

    !important;width:100%}

    注:

    代码应用的式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)}

    展开全文
  • HTML背景图片透明度设置

    万次阅读 2017-12-18 20:11:45
    html xmlns="http://www.w3.org/1999/xhtml"> head> meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> title>无标题文档title> style type="text/css"> .STYLE5 {color: #000000} ....
    <!DOCTYPE html>
    <html>
    <head>
        {% csrf_token %}
        {% load staticfiles %}
        {% load bootstrap3 %}
        {% bootstrap_css %}
        {% bootstrap_javascript %}

        <title>movie</title>
        <style type="text/css">
            .bodystyle{
            filter:alpha(opacity=20);  
            -moz-opacity:0.2;  
            -khtml-opacity: 0.2;  
            opacity: 0.4;
            height:100%;
            width:100%;
            position:absolute;
            }

            body{text-align:center}
            h1{text-align:center;}
        </style>
    </head>
    <body>
        <div class="bodystyle">

        <img src="{% static "images/3.jpg" %}" width=100% height=100%></div>

        <div style="position:absolute;">

         <h1>The movie space</h1>
        <div >
            <video src="/static/movie/movie.ogg"  width="720px" height="540px" controls="controls">
            Your browser does not support the video tag.
            </video>
        </div>

        </div>
      
    </body>
    </html>
    展开全文
  • 背景图片是 <body background="Background_1280x1024.jpg" ; > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> &...
  • web中html+CSS修改背景图片的不透明度

    千次阅读 2020-05-04 21:37:15
    在web的开发中,要增加一张背景图片,但是图片透明度太高看着很不舒服,所以有必要降低图片透明度。但是在body中增加一张背景图片后,不能直接的修改图片透明度。用div包裹body内容修改的不透明度是整一个div...

    在web的开发中,要增加一张背景图片,但是图片不透明度太高看着很不舒服,所以有必要降低图片不透明度。但是在body中增加一张背景图片后,不能直接的修改图片不透明度。用div包裹body内容修改的不透明度是整一个div的。所以我个人的想法是采用一个div添加背景图片,直接让这张图片充满整个页面,而不是跟随着body内容大小设置背景图片。代码如下:
    html代码:

    <div class="my-background"></div>
    

    css代码:

    .my-background{
        position: fixed;
        height: 100%;
        width: 100%;
        background-image: url("../images/moroccan-flower.png");
        opacity: 0.3 ;
    }
    

    position设置为fixed,会固定在屏幕位置,根据height和width设置背景图片大小。如果将position改为absoluted,则最后只会根据屏幕的大小充满屏幕,对于屏幕下方的内容不会进行填充。
    opacity为设置div的不透明度。因为div内没有放置内容,所以只会修改背景图片的不透明度,不会影响到内容。

    展开全文
  • 关于设置背景图片透明度html+css)

    万次阅读 多人点赞 2018-03-22 16:58:24
    2018.3.22设置背景图片透明度,而不是颜色这种,是图片显示这个就跟某些博客能够换背景图片当主题一样的道理,看了好久终于搞清楚了&lt;body&gt;里面是不能直接设置图片透明度的需要借助&lt;div&...

    2018.3.22

    设置背景图片的透明度,而不是颜色这种,是图片显示

    这个就跟某些博客能够换背景图片当主题一样的道理,看了好久终于搞清楚了

    <body>里面是不能直接设置图片的透明度的

    需要借助<div>

    <style type="text/css">
    .bodystyle{
    filter:alpha(opacity=50);  
    -moz-opacity:0.5;  
    -khtml-opacity: 0.5;  
    opacity: 0.5;
    width:100%;
    position:absolute;
    background:url(图像/8.JPG) ; 
    background-attachment:fixed;
    }
    </style>

    需要在之前就写好,用类的方法表示。

    <body >
    <div class="bodystyle"></div>
    </body>

    然后在div中引用这个类,就可以实现图片透明度设置

    但是这样也有问题,如果中间有文本存在的话就会也变为透明字体,而且要当背景图片的话就需要将文本放入两个<div>中间

    所以需要在css中设置文本的字体透明度

    opacity: 1;

    即可

    展开全文
  • HTML文件代码 <!DOCTYPE html> <html> <head> <head> <body "> <div id="Layer1" style="position:fixed; left:0px; top:0px; width:100%; height:100%"> <img src=...
  • html中如何设置背景背景颜色的透明度
  • Html 层级 透明度 背景图片

    千次阅读 2019-01-23 16:01:08
     * 透明度,需要一个0-100之间的值  * 0 表示完全透明  * 100 表示完全不透明  * 50 半透明  *   * 这种方式支持IE6,但是这种效果在IE Tester中无法测试 背景设置图片  * 使用background-image...
  • 如何设置背景透明度

    千次阅读 2018-09-17 20:15:25
    设置背景透明度分为两种:一种背景为颜色设置的纯色背景;另一种是图片做背景。 【情况一】纯色背景 关键代码:background:rgba(R,G,B,A) RGB--------三原色(red,green,bule) A-------透明度 关于三原色最终...
  • div 背景颜色透明度设置

    千次阅读 2013-09-16 14:35:55
    div设置背景颜色透明度    通常我们通过div的style样式属性filter来设置div的背景透明样式。可根据alpha提供的如下参数进行组合控制 filter: Alpha ( enabled=bEnabled , style=...
  • 背景透明度如何设置一个div的背景透明度 来源:互联网 作者:佚名 时间:12-31 16:55:48 【大 中小】 如何设置一个div的背景透明度,对于一些新手朋友有些陌生,接下来详细介绍实现方法,有需要了解的朋友可以...
  • Openlayers地图背景透明度设置

    千次阅读 2018-07-10 18:03:19
    在实际开发中,为了美观,需要设置Openlayers中地图div中除了地图之外的地方的透明度,这个通过设置.ol-viewport的样式就可以完成。项目测试代码如下:&lt;!DOCTYPE html&gt; &lt;html&gt; &...
  • css设置遮罩层背景颜色透明度渐变

    千次阅读 2020-08-25 14:34:53
    css设置遮罩层背景颜色透明度渐变 css代码 background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));
  • 在网页布局中有时为了网页的整体美观,可能需要将网页中的某些部分设置为背景颜色透明,那么如何设置背景颜色透明呢?本篇文章就来给大家介绍一下css设置背景颜色透明的方法。 在css中设置背景颜色透明的方法有两种...
  • 关于div设置背景颜色透明度

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

    千次阅读 2019-09-06 13:58:13
    最近看到美图秀秀的一些功能,可以手动设置图片透明度并显示在其它图片上,所以自己动手做了个小Demo,实际效果如下: (图片仅供参考使用) 可以看到拖动下方进度条,可以控制左上角图片透明度。 方法如下...
  • 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设置透明度的两种方法(代码实例)。有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 一、css rgba()设置颜色透明度 语法: 1rgba(R,G,B,A); RGBA 是代表Red(红色) Green...
  • android-设置/去除背景透明度

    千次阅读 2016-11-29 21:02:20
    Button或者ImageButton的背景设为透明或者半透明半透明...透明颜色和不透明度 (alpha) 值以十六进制表示法表示。任何一种颜色的值范围都是 0 到 255(00 到 ff)。对于 alpha,00 表示完
  • CSS鼠标点击式变化图片透明度

    千次阅读 2015-11-28 08:08:32
    今天分享前端代码主题:jequery控制css图片透明度 很多时候在网站图片处理上需要实现一些辅助效果,比如鼠标在图片上滑动时或点击时改变图片颜色(变灰或者其他),其实一个简单的办法就是改变图片css透明度属性。 ...
  • Android之使用参数改变ProgressDialog的位置、大小、背景透明度、屏幕透明度 2015-02-28 23:39 3662人阅读 评论(0) 收藏 举报  分类: Android开发之路(68)  版权声明:本文为博主...
  • VSCode 设置透明背景,解决透明度的问题但这个方法有点个确定,就是透明度的问题,照片透明度越高,那么字体的透明度也高,导致代码或者菜单选项看不清 网上找到的大多数教程都是使用这个方法 /*background start*...
  • HTML设置背景透明

    万次阅读 2018-03-03 21:54:54
    今天看视频最后作业是 设置一个盒子(div) 然后让背景透明 我当时就很单纯的用opacity:0.5;(0是全透明 1是完全不透明)然后发现 我的妈!!! 全部都透明了 我较劲脑子想出来的一首诗竟然也透明了!!!后来我就...
  • jQuery对li设置背景颜色和透明度

    千次阅读 2016-09-13 14:36:09
    在用jQuery对页面ul下的li进行mouseover和mouseleave设置背景颜色和透明度的设置时,发现当mouseleave时,本身在li里面的字体颜色变淡了。 代码如下: &lt;!DOCTYPE HTML&gt; &lt;html&gt; &...
  • HTML代码: 导航栏的类 navbar这个类需要在js中调用 <!-- 导航栏的类 start --> <div class="container wis-nav-pc"> <div class="row"> <div class="col-md-12"> ...
  • 网页的背景图片代码

    万次阅读 2009-07-17 19:37:00
    网页背景图片代码1.(最普遍类)body{background-image:url(logo.gif);background-repeat:no-repeat;background-position:center}说明:以上代码为网页背景图片固定代码!网页背景图片固定代码,这样,当向下拉网页时,...
  • Android 图片合成:添加蒙板效果 不规则相框 透明度渐变效果的实现 先贴一张效果图,这是一张手机截屏: 左上方的风景图:背景图片 右上方的人物图:前景图片 左边心型透明图:相框图片 右边心型黑色...
  • html透明度调整

    千次阅读 2019-05-24 12:32:35
    :将一张图片设置为html背景图,并且不平铺。如果平铺的话将占满整个网页。 background-size: cover;:background-size的cover特定值会保持图像本身的宽高比例,将图片缩放到正好完全覆盖定义背景的区域。 z-index...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 49,659
精华内容 19,863
关键字:

html背景图片透明度代码