Puedo ver en las referencias CSS cómo establecer la transparencia de la imagen y cómo establecer una imagen de fondo. Pero, ¿cómo puedo combinar estos dos con el fin de establecer una imagen de fondo transparente?
Tengo una imagen que me gustaría utilizar como fondo, pero es demasiado brillante - me gustaría bajar la opacidad a aproximadamente 0,2. ¿Cómo puedo hacerlo?
#main {
background-image: url(/wp-content/uploads/2010/11/tandem.jpg);
}
#main {
position: relative;
}
#main:after {
content : "";
display: block;
position: absolute;
top: 0;
left: 0;
background-image: url(/wp-content/uploads/2010/11/tandem.jpg);
width: 100%;
height: 100%;
opacity : 0.2;
z-index: -1;
}
Dos métodos:
<div>
que sea position: absolute;
antes de #main
y la misma altura que #main
, entonces aplicar la imagen de fondo y opacity: 0.2; filter: alpha(opacity=20);
.Bueno, la única manera de CSS de hacer sólo la transparencia del fondo es a través de RGBa
, pero ya que desea utilizar una imagen que sugeriría el uso de Photoshop o Gimp para hacer la imagen transparente y luego usarla como fondo.