Opacidade de imagem de fundo

Gostaria de saber se é possível, ter uma imagem de fundo em um site com uma opacidade, que deixe a imagem mais fraca, e aumente a corda de fundo normal, que coloquei azul. Assim, a imagem ficaria mais ou menos visível, porém também daria pra ver a cor azul de fundo. Ou colocar um background-image anula a cor de fundo? E viceversa?

1 curtida

Você pode adicionar um atributo background onde você adiciona um rgba para controlar a opacidade e logo em seguida uma url com sua imagem. Veja o exemplo abaixo:

.box{
  height: 300px;
  background: url(sua_url.com) rgba(50,0,0, .70) no-repeat
}
<div class="box"></div>

Resultado