Estilos CSS en función del navegador

lunes 8 de octubre de 2007

Estilos CSS en función del navegador

Con el siguiente truco, mediante JavaScript, puedes aplicar diferentes estilos CSS en función del navegador del usuario e incluso dependiendo del sistema operativo:

1. Incluye este JavaScript en tu página, de la siguiente manera:

<script src="css_browser_selector.js" type="text/javascript"></script>

2. Utiliza las siguientes clases CSS en tu hoja de estilos: .[so].[nav] (sin espacio entre .[so] y .[nav]), como en los siguientes ejemplos:

html.gecko div#header { margin: 1em; }
.opera #header { margin: 1.2em; }
.ie .mylink { font-weight: bold; }
.mac.ie .mylink { font-weight: bold; }
.[so].[nav] .mylink { font-weight: bold; }

Códigos de sistema operativo disponibles [so]: