@media screen and (-webkit-min-device-pixel-ratio:0)
{
div
{
color: red; /* The text will appear red only in Safari and Google Chrome */
}
}
Archive for css
CSS hack para safari y chrome
Rotando texto con CSS
Jonathan Snook, publica un intersante artículo en el que nos muestra como rotar texto mediante CSS.
El código está claro que no es estandar y solo funciona en Safari/WebKit, Firefox e Internet Explorer.
//HTML
<div class=”example-date”>
<span class=”day”>31</span>
<span class=”month”>July</span>
<span class=”year”>2009</span>
</div>
//CSS .year { [...]
Opacidad con CSS Cross-Browser
.show-50 {-moz-opacity:.50;filter:alpha(opacity=50);opacity:.50;}
Cookies con jQuery
Una cookie es un fragmento de información que se almacena en el disco duro del visitante de una página web a través de su navegador. Muy útil en la programación web para guardar y leer algunos datos de configuración. Crear, configurar, leer su valor y eliminarla es fácil con jQuery.
Crear una cookie en jQuery es tan fácil como [...]
Técnicas para Cross-Browser CSS
Con CSS (Hojas de estilo en cascada) también se habla de Cross-Browser, desarrollo de páginas web que se ven exactamente igual en cualquier navegador. Existen algunas técnicas CSS con ese objetivo. Veamos algunas:
Resetear CSS
La mayoría de navegadores definen por defecto diferentes estilos para los elementos HTML. Por ello lo primero a realizar en nuestro diseño es resetear nuestra [...]
¿px, em, %, pt, o palabras clave?¿Como definimos tamaños de fuentes?
CSS-Trick, nos muestra un interesante artículo sobre las cualidades de los diferentes sistemas que tenemos para indicar el tamaño de las fuentes de nuestras aplicaciones.
px: Ofrece el máximo de precisión a la hora de indicar un tamaño. Aunque se olvidan del usuario, no hacen caso a la configuración del visitante.
em: Los más difíciles de cuadrar [...]
CSS Poligonal para crear tooltips con punteros
En Group Filament han escrito un post en el que explican como usar CSS poligonal para crear tooltips que tengan punteros pero sin utilizar imágenes.
El concepto queda explicado con el siguiente CSS:
div {
width:0;
height:0;
border-left: 20px solid transparent;
[...]
¿Por qué maquetar con estándares?
Resumen: Hace poco me pidieron una presentación para justificar por qué hay que codificar webs mediante XHTML y CSS. Con lo fácil que es maquetar con tablas? Este es un resumen de las conclusiones que defendí.
Mirando al pasado. En el inicio sólo había tablas
Esta frase no es del todo cierta, aunque si lo parezca. Las [...]
Botones con Imagenes Reutilizables(GMAIL)
Mientras esperamos que alguna futura versión de HTML nativo nos de nuevos controles para que usemos en el navegador, en Google han jugado y experimentaron nuevos controles que ellos llaman “Custom Buttons”y las han puesto en sus aplicaciones. Estos botones los pusieron en marcha en Gmail y Google Reader recientemente.
Los botones están diseñados para un [...]
10 sucios trucos para CSS
Martin Ivanov ha hecho una recopilación de 10 hacks CSS que seguro nos pueden servir en algún que otro momento.
1) Mejorando el escalado y resampleado de las imagenes en Internet Explorer
En Internet Explorer 7 la propiedad de escalado por el método bicubic está deshabilitada por defecto y debemos activarla nosotros desde nuestro CSS indicando que [...]