0

Hola tengo una duda como poder seleccionar una imagen para darle opacidad ya que yo la agregue de la siguiente manera

anexo imagen y codigo

introducir la descripción de la imagen aquí

.no-webp .inicio {
    background-image: url(../../build/img/img1.jpg);
}

.webp .inicio {
    background-image: url(../../build/img/img1.jpg);
}

como verán anexe así la imagen pero quiero ver si puedo darle una opacidad para que no este tan fuerte el color de la imagen. un cordial saludo y gracias de antemano

2 respuestas 2

0

Debes utilizar :before para tus elementos

.webp .inicio {
  position: relative;
  z-index: 1;
}

.webp .inicio:before {
  content: " ";
  position: absolute;
  top: 0; 
  left: 0;
  width: 100%; 
  opacity: .4; 
  z-index: -1;
  background: url(../../build/img/img1.jpg);
}
1
  • no me funciona desaparece la imagen
    – snakeshin
    Commented el 6 nov. 2021 a las 22:40
0

.no-webp .inicio { opacity: 0.5;}

la propiedad opacity puede ser desde 0.1 a 1, siendo 1 el valor por default.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.