Re: [Ovillo] PNG con trasnparencia (canal alpha) en IE 6 einferiores
Gracias a [EMAIL PROTECTED] por contestar, al final lo resolvi como dice Gab en
el post
del 23 de Julio de 2007 http://www.daltonlp.com/view/217
No sé cual método es mejor, el que dice Almorca o ese en que se dice que la
solución es hacer una hoja de estilo diferente para los ie 6.
trans_box2 {
font-family:verdana;
font-weight:bold;
padding:40px;
margin:30px;
border:solid 1px #555;
/* Mozilla ignores crazy MS image filters, so it will skip the following
*/
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,
sizingMethod=scale, src='/75p_honey.png');
}
/* IE ignores styles with [attributes], so it will skip the following. */
trans_box2[class] {
background-image:url(/75p_honey.png);
}
div style=float:left;background-image:url(/flowers.jpg);border:solid 1px
#000;padding:10px;
div class=trans_box1 style=float:left;
I like flowers.
/div
div class=trans_box1 style=float:left;
They smell nice.
/div
div class=trans_box2 style=float:left;
a href=http://www.google.com/search?q=flowers+bees+honeygt;When combined
with bees, they make honey.../a
/div
Comment by Gab
posted Jul 23, 2007
Nice. Almost perfect. Only problem is that IE7 will load the background 2
times, as it doesn't ignore .trans_box2[class]. This is not a big deal in
this case, but it was for me.
What I did was create a perfectly normal stylesheet with no hacks. I used ID
selectors to apply my background image, like I normally would. IE6 and below
won't display the PNGs properly using this stylesheet.
Next I linked a second stylesheet (containing the PNG fix codes) to my page.
So that the browsers apply both stylesheets at the same time, we need to
apply an identical title attribute to both these styles. Now since I only
wanted IE6 and below to use the second stylesheet, I applied IE's
conditional comments for the second stylesheet
(http://www.quirksmode.org/css/condcom.html)
The last thing to do was add background: none !important; to the div
containing the background image in the second stylesheet, so that the
background image only shows for the class selector (fixed PNG) and not the
ID selector.
So basically I can now style any div normally using IDs, and if it happens
to contain a PNG background, I just add the class that will be used in the
second stylesheet to it, and in the second stylesheet add the ID containing
the PNG. A lot less complicated imo.
- Mensaje original -
De: Almorca [EMAIL PROTECTED]
Para: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
Enviado: viernes, 03 de octubre de 2008 22:54
Asunto: Re: [Ovillo] PNG con trasnparencia (canal alpha) en IE 6 einferiores
http://www.anieto2k.com/2006/08/28/png-internet-explorer-soluciones-varias/te
ayudará. Lo que tienes que usar es este código:
background-image: url(trasparente.png)!important;
background-image: none;
filter: none !important;
filter:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imagen/trasparente.png');
Si quieres algo más general (que funcione con todos los png de tu web)
puedes usar http://labs.unitinteractive.com/unitpngfix.php
2008/10/3 Alejandro Jorge [EMAIL PROTECTED]
Hola,
tengo un contenedor con una imagen de fondo y dentro de éste tengo otro
que
tiene una imagen png con transparencia, por lo que me permite ver el fondo
del elemento que lo contiene. El caso es que en IE 7 o en Firefox se ve
perfecto, pero en IE 6 (no se en la 5) no funciona.
Hay alguien que sepa como hacerlo sin usar javascript, o el metodo mas
accesible posible. Seguro que de esto ya se ha hablado en la lista..
Gracias y saludos.
_
¿Sigue el calor? Consulta MSN El tiempo
http://eltiempo.es.msn.com/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
--
We don't need no education - Pink Floyd
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
[Ovillo] [OT] WEX, editor hexadecimal para la web
He hecho un editor hexadecimal online para paginas webs, que permite inspeccionar los bytes reales que envía el servidor. Con la popularización de UTF-8, me ha parecido necesario poder tener esta herramienta, para visualizar que realmente esta llegando al navegador. Ejemplo de uso: http://zerror.com/bin/wex/?url=www.terra.es#1160 En general: http://zerror.com/bin/wex/?url=Tu sitio web aqui, sin http:// Las urls hay que ponerlas sin http:// (se añadira luego). Por motivos de seguridad no soporta la subcadena .., o http://; en el interior de la url. En un principio es solo un experimento para mi uso, puede que lo mueva de sitio si reorganizo mi sitio web. Un saludo, Tei ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] PNG con trasnparencia (canal alpha) en IE 6 einferiores
Los dos métodos se basan en lo mismo, usar los filtros de ie.
Si solo tienes una imagen transparente esta es la mejor opción, si tienes
muchas ya tienes que recurrir a javascript para automatizar el proceso.
Lo que yo cambiaría es que crearía una hoja de estilos con los *hack* de ie6
y la enlazaría mediante comentarios condicionales en el html para así no
tener el código más organizado y cargar de menos trabajo a los navegadores
que si cumplen los estándares.
El 4 de octubre de 2008 11:06, Jorge [EMAIL PROTECTED] escribió:
Gracias a [EMAIL PROTECTED] por contestar, al final lo resolvi como dice Gab
en el
post
del 23 de Julio de 2007 http://www.daltonlp.com/view/217
No sé cual método es mejor, el que dice Almorca o ese en que se dice que la
solución es hacer una hoja de estilo diferente para los ie 6.
trans_box2 {
font-family:verdana;
font-weight:bold;
padding:40px;
margin:30px;
border:solid 1px #555;
/* Mozilla ignores crazy MS image filters, so it will skip the following
*/
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,
sizingMethod=scale, src='/75p_honey.png');
}
/* IE ignores styles with [attributes], so it will skip the following. */
trans_box2[class] {
background-image:url(/75p_honey.png);
}
div style=float:left;background-image:url(/flowers.jpg);border:solid 1px
#000;padding:10px;
div class=trans_box1 style=float:left;
I like flowers.
/div
div class=trans_box1 style=float:left;
They smell nice.
/div
div class=trans_box2 style=float:left;
a href=http://www.google.com/search?q=flowers+bees+honey;When combined
with bees, they make honey.../a
/div
Comment by Gab
posted Jul 23, 2007
Nice. Almost perfect. Only problem is that IE7 will load the background 2
times, as it doesn't ignore .trans_box2[class]. This is not a big deal in
this case, but it was for me.
What I did was create a perfectly normal stylesheet with no hacks. I used
ID
selectors to apply my background image, like I normally would. IE6 and
below
won't display the PNGs properly using this stylesheet.
Next I linked a second stylesheet (containing the PNG fix codes) to my
page.
So that the browsers apply both stylesheets at the same time, we need to
apply an identical title attribute to both these styles. Now since I only
wanted IE6 and below to use the second stylesheet, I applied IE's
conditional comments for the second stylesheet
(http://www.quirksmode.org/css/condcom.html)
The last thing to do was add background: none !important; to the div
containing the background image in the second stylesheet, so that the
background image only shows for the class selector (fixed PNG) and not the
ID selector.
So basically I can now style any div normally using IDs, and if it happens
to contain a PNG background, I just add the class that will be used in the
second stylesheet to it, and in the second stylesheet add the ID containing
the PNG. A lot less complicated imo.
- Mensaje original -
De: Almorca [EMAIL PROTECTED]
Para: Ovillo, la lista de CSS en castellano ovillo@lists.ovillo.org
Enviado: viernes, 03 de octubre de 2008 22:54
Asunto: Re: [Ovillo] PNG con trasnparencia (canal alpha) en IE 6
einferiores
http://www.anieto2k.com/2006/08/28/png-internet-explorer-soluciones-varias/te
ayudará. Lo que tienes que usar es este código:
background-image: url(trasparente.png)!important;
background-image: none;
filter: none !important;
filter:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src='imagen/trasparente.png');
Si quieres algo más general (que funcione con todos los png de tu web)
puedes usar http://labs.unitinteractive.com/unitpngfix.php
2008/10/3 Alejandro Jorge [EMAIL PROTECTED]
Hola,
tengo un contenedor con una imagen de fondo y dentro de éste tengo otro
que
tiene una imagen png con transparencia, por lo que me permite ver el
fondo
del elemento que lo contiene. El caso es que en IE 7 o en Firefox se ve
perfecto, pero en IE 6 (no se en la 5) no funciona.
Hay alguien que sepa como hacerlo sin usar javascript, o el metodo mas
accesible posible. Seguro que de esto ya se ha hablado en la lista..
Gracias y saludos.
_
¿Sigue el calor? Consulta MSN El tiempo
http://eltiempo.es.msn.com/
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
--
We don't need no education - Pink Floyd
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://lists.ovillo.org/mailman/listinfo/ovillo
___
Lista
Re: [Ovillo] Semantica h1
Das la caña, das el cebo ... te faltó dar el pescado ;-) http://es.groups.yahoo.com/group/accesoweb/msearch?query=Encabezados%2C+logotipos+e+im%E1genessubmit=Buscarcharset=ISO-8859-1 2008/10/3 Ignacio Gros [EMAIL PROTECTED] Hola: hace unos meses se comentó el tema en AccesoWeb (http://es.groups.yahoo.com/group/accesoweb/) El hilo se titulaba Encabezados, logotipos e imágenes. Saludos, Ignacio Gros ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo -- _ Fernando Gutiérrez ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
