Can I set an opacity only to the background image of a div?

后端 未结 8 1416
轮回少年
轮回少年 2020-11-22 11:09

Let\'s say I have

Hi there

I want to put a background-image and give it an opacit

8条回答
  •  無奈伤痛
    2020-11-22 12:02

    Hello to everybody I did this and it worked well

    	var canvas, ctx;
    
    		function init() {
    			canvas = document.getElementById('color');
    			ctx = canvas.getContext('2d');
    
    			ctx.save();
    			ctx.fillStyle = '#bfbfbf'; //  #00843D   // 118846
    			ctx.fillRect(0, 0, 490, 490);
    			ctx.restore();
    		}
    section{
    		height: 400px;
    		background: url(https://images.pexels.com/photos/265087/pexels-photo-265087.jpeg?w=1260&h=750&auto=compress&cs=tinysrgb);
    		background-repeat: no-repeat;
    		background-position: center;
    		background-size: cover;
    		position: relative;
    	
    }
    
    canvas {
    	width: 100%;
    	height: 400px;
    	opacity: 0.9;
    
    }
    
    #text {
    	position: absolute;
    	top: 10%;
    	left: 0;
    	width: 100%;
    	text-align: center;
    }
    
    
    .middle{
    	text-align: center;
    	
    }
    
    section small{
    	background-color: #262626;
    	padding: 12px;
    	color: whitesmoke;
      letter-spacing: 1.5px;
    
    }
    
    section i{
      color: white;
      background-color: grey;
    }
    
    section h1{
      opacity: 0.8;
    }
    
    
    	
    	Metrics
    	
      
      
      
    
    
    assessment

    Medimos las acciones de tus ventas y disenamos en la WEB tu Marca.

    Metrics & WEB

提交回复
热议问题