Para insertar «opacidad» a los border en css3 se usa el método RGBa (que es la extensión del RGB pero con un canal de opacidad) para seleccionar el color del borde. Un ejemplo de un borde de 1 pixel de […]
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 […]
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: […]
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: <div class="elemento" data-comentarios="56"></div> <div class="elemento" […]
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: .no-seleccionable { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } En […]
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 […]
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 […]
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 […]
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 […]
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 […]