Categoría: CSS

Hacks en CSS que te evitarán dolores de cabeza en Internet Explorer

Posted on by Edgardo

Debido a la diversidad de navegadores y las diferencias entre versiones es muy útil hacer uso de algunos hacks si queremos que la apariencia de nuestras páginas en Internet Explorer, sea igual que en el resto de los navegadores que soportan los estándares. A continuación mostramos algunos hacks útiles, que podremos utilizar en nuestros archivos CSS para Read more about Hacks en CSS que te evitarán dolores de cabeza en Internet Explorer[…]

8 filtros CSS para imágenes que todo diseñador web debería conocer

Posted on by Edgardo

En muchas ocasiones cuando un desarrollador o diseñador web lleva a cabo la maquetación de un proyecto, necesita aplicar determinados efectos en algunas imágenes. Vamos a mostrar unos filtros para aplicar los efectos más populares usando únicamente código CSS.   Antes de empezar, hay que tener en cuenta que algunos de estos filtros solo son Read more about 8 filtros CSS para imágenes que todo diseñador web debería conocer[…]

Sombra CSS

Posted on by Edgardo

Con CSS se pueden aplicar dos tipos de sombras: sombras a elementos HTML y sombras a textos. Con ellas podemos conseguir un efecto visual más elegante a nuestras páginas. Un efecto interesante que podemos utilizar en nuestros diseños web a partir de CSS3 es el de las sombras. A través de dos propiedades, box-shadow y Read more about Sombra CSS[…]

Clases CSS para footer siempre este abajo

Posted on by Edgardo

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; sizing: border-box; } body, html{ padding: 0; margin:0; width: 100%; height: 100%; } body{ display: table; -moz-display: table; -webkit-display: table; -o-display: table; -ms-display: table; height: 100%; } footer{ color: #fff; background: #525252; padding: 10px; display: table-row; -moz-display: table-row; -webkit-display: table-row; -o-display: table-row; -ms-display: table-row; filter: display(display= table-row;;); Read more about Clases CSS para footer siempre este abajo[…]

gráfico circular CSS

Posted on by Edgardo

Lógica del gráfico circular En CSS, por ahora, no hay una propiedad que nos permita crear gráficos circulares de una forma sencilla, por lo que debemos ingeniarnosla para simularlo. Para simular el gráfico combinaremos el uso de semicírculos y animaciones. Dos semicírculos del mismo color forman un círculo completo, el cual podemos considerar como un Read more about gráfico circular CSS[…]

Gráficos circulares, lineales y de barras en puro Css

Posted on by Edgardo

Gráficos circulares, lineales y de barras en puro Css En ella había un par de detalles que su autor había dejado sin recrear: dos gráficos. Uno lineal y otro circular. Una pena que quedase inconcluso un trabajo tan minucioso y detallista sólo por ello. Los veteranos del blog seguro que recuerdan que hace ya un Read more about Gráficos circulares, lineales y de barras en puro Css[…]

Recorte y enmascaramiento en CSS

Posted on by Edgardo

Ambas cosas se usan para ocultar algunas partes de elementos y mostrar otras partes. Pero hay, por supuesto, diferencias entre los dos. Diferencias en lo que pueden hacer, diferencias en sintaxis, diferentes tecnologías involucradas, nuevas y obsoletas, y diferencias en el soporte del navegador. Y lamentablemente hay bastante información desactualizada. Veamos si podemos solucionarlo.   Read more about Recorte y enmascaramiento en CSS[…]

Formas básicas con CSS: triángulos, círculos, trapecios, rectángulos, cuadrados … CSS

Posted on by Edgardo

Formas básicas con CSS: triángulos, círculos, trapecios, rectángulos, cuadrados … CSS Juan Padial Publicado el 24 agosto, 2014 – Actualizado el 17 octubre, 2016 Estoy desarrollando mi primer tema comercial para WordPress y en el diseño se utilizan algunas formas geométricas básicas como elementos decorativos. Podría haberlos insertado mediante imágenes o mediante iconos vectoriales pero Read more about Formas básicas con CSS: triángulos, círculos, trapecios, rectángulos, cuadrados … CSS[…]