CSS

Diferentes formas de customizar la propiedad “resize” de css que permite redimensionar los textarea de los formularios. La propiedad resize de css tiene estos 4 valores: resize: both; resize: horizontal; resize: vertical; resize: none; Unos ejemplos de uso: both: Redimensiona […]

Leer más...

En html las tablas tienen los atributos cellpadding (permite especificar la distancia entre el margen interior de la celda y su contenido) y cellspacing (permite especificar la distancia entre las celdas y el margen exterior de la tabla). Por ejemplo: […]

Leer más...

CSS: if data-atributo

Si utilizais en html5 los data attributes y quereis jugar desde css en función del valor de un determinado data-atributo a continuación unos ejemplos: Un html y css de ejemplo para que veáis el resultado:

Si existe atributo […]

Leer más...

La propiedad de css3 “user-select” permite deshabilitar la “selección de texto” con el ratón. Un ejemplo, imagina que tienes un texto que quieres que no se pueda seleccionar:

En IE solo a partir de la versión 10.

Leer más...

Si usáis la propiedad “transition” de css3 para crear animaciones, y observáis que al hacer “hover” sobre un elemento, el efecto hace que a su vez se mueva 1px… para solucionarlo podemos añadir la función “translateZ” de transform con valor […]

Leer más...

CSS3: efecto temblor

A continuación un ejemplo en css3 para conseguir un efecto temblor / vibración de un elemento, en este caso podéis ver un demo situándote encima del logo de bufa.es. Es un ejemplo básico, que podéis customizar a vuestro gusto… en […]

Leer más...

Prefijos CSS

Los principales prefijos css: -webkit-, -moz-, -o-, -ms- se anteponen al nombre de la propiedad del estilo para que el navegador web reconozca esa determinada característica. Se aplican normalmente a estilos css3 en experimentación que aún no forman parte de […]

Leer más...

Escalar un imagen utilizando solo CSS3 es realmente sencillo empleando el método scale() de transform. Es este ejemplo vamos a escalar la imagen un 50% más de su tamaño original al situarnos encima de ella (hover). Con este método podemos […]

Leer más...

Como conseguir un ejecto cortina, en el que el color de fondo se va transformado en un degradado de colores en varias columnas… A continuación explico el funcionamiento para hacerlo en css3 sin utilizar imágenes, solo utilizando la función linear-gradient […]

Leer más...

Por defecto la etiqueta hr tiene 1px de borde por sus 4 lados. Si queremos que la línea sea fina, basta con quitar el borde, fijar en pixeles la altura y el color que queramos por medio de background-color. En […]

Leer más...