Estoy creando una página web que tiene una div transparente.Div no transparente dentro de un div transparente
Quiero agregar un div no transparente dentro de ese div transparente y me parece que también es transparente.
Intento establecer el div dentro de la opacidad: 1 pero no funciona.
¿Qué debo hacer?
Hay dos maneras que conozco de evitar este:
Bueno, al usar un elemento padre con la posición: relativo, también puede tener un elemento secundario translúcido, posicionado en posición absoluta, situado detrás de elementos secundarios no translúcidos y con una posición normal. Esto tiene la ventaja de no necesitar imágenes externas o tamaños fijos. – Shog9
Dependiendo de su situación, debería considerar que IE6 no admite archivos PNG transparentes por sí mismo y necesita ayuda (con bibliotecas de JavaScript adicionales). – merkuro
Podría estar en blanco, ya que IE6 y 7 no son compatibles con la opacidad de CSS que billy está usando de todos modos (a menos que, por supuesto, no mencionó su filtro alfa de IE). –
Desafortunadamente, esto no funciona en CSS. En el pasado, he usado el posicionamiento para insertar el div no transparente que contiene el contenido en el div transparente. No podía desenterrar un antiguo código de mis proyectos, pero encontré esta entrada del blog:
He encontrado esto en alguna parte mientras que la investigación CSS3 y disculpas que no puedo volver a llamar, donde el fin de crédito el autor apropiado
Pero si buscas un fondo semitransparente de color sólido en un div. En lugar de establecer el color y controlar la transparencia con propiedades de opacidad/alfa, establezca la propiedad de color de fondo directamente utilizando el formato rgba (rrr, ggg, bbb, aaa). Esto evitará que los elementos secundarios hereden cualquier transparencia.
ex.
#mydiv { background-color: rgba(128,64,0,0.75); }
Gran respuesta, esto debería tener el tic verde. –
¡Gran solución! ¡Hay muchos sitios que dicen que no hay solución para este problema! – DanielX2010
Bueno. Lamentablemente, los colores css3 solo funcionan en ie9 + – taseenb
uso de fondo, relleno, de fondo-origen para controlar el acolchado y z-index para controlar la posición del elemento. Por ejemplo:
#mydiv{ background: white; padding:100px; background-origin:border-box; z-index:1}
¿Puede mostrar un fragmento del código? –
Tengo mucha curiosidad de por qué tendrías que hacer esto. El fondo del div es transparente por defecto. ¿Por qué hacer que todo sea transparente solo para mostrarlo de nuevo? –
El problema entra en juego si coloreas un div y configuras su opacidad para hacerlo transparente. Si luego quieres poner texto en este div, el texto es transparente, y eso no siempre es deseable. – NilObject