Crear efecto 3d en imágenes para tu web Hoy vamos a ver un efecto 3d que puedes hacer con imágenes para utilizar en tu web, Llevamos unas semanas haciendo varios efectos en imágenes, y hoy vamos a continuar con un efecto 3d muy sencillo que puede darle un toque original a tu página web. Este […]
Capitalizar o destacar la primera letra
Cómo capitalizar la primera letra de un texto Hoy vamos a ver cómo podemos capitalizar o destacar la primera letra de un párrafo usando un código de CSS muy sencillo. Seguramente has visto este efecto en innumerables ocasiones, o incluso lo has hecho alguna vez cuando maquetas textos con Microsoft Word. Pues en esta ocasión […]
Diferencia entre display:none y visibility:hidden
Cual es la diferencia entre display:none y visibility:hidden En esta ocasión vamos a ver la diferencia entre entre display:none y visibility:hidden. Hoy mucha gente que confunde estas dos propiedades, pero aunque las dos sirven para ‘esconder’ elementos de tu web, no funcionan de la misma forma. Hoy veremos cuales son sus diferencias y cuando usar […]
Numerar secciones y subsecciones con CSS
Cómo crear secciones numeradas con CSS En esta ocasión veremos como podemos numerar secciones y subsecciones utilizando código CSS. Ya sabemos hacerla mediante el editor, pero en esta ocasión aprenderemos a hacerlo mediante código. El resultado será algo parecido a lo que conseguimos utilizando Microsoft Word, pero en WordPress. Crear una lista numerada siempre es […]
Tipos de cursores en diseño web
Todos los tipos de cursores Hoy vamos a ver los distintos tipos de cursores que existen y cómo podemos cambiar los que vienen por defecto en nuestra web. Con estos códigos podemos cambiar los cursores por los que nosotros elijamos, con lo que ganaremos en personalización en nuestra web. Tipos de cursores Seguramente conocerás el […]
Crear un menú de navegación responsive
Menú de navegación responsive con código Hoy vamos a ver cómo podemos crear un menú de navegación responsive, es decir, que se adapte al tamaño de ventana del dispositivo que lo muestra. Este artículo complementa, en cierto sentido el artículo de la semana pasada, donde hemos visto cómo hacer una galería de imágenes responsive. Lo […]
Cómo hacer una galería de imágenes responsive
Crear galería de imágenes responsive En esta ocasión vamos a aprender a crear una galería de imágenes responsive con la que mostraremos nuestras imágenes de la forma correcta, y como siempre, sin utilizar ningún plugin. Código CSS que vamos a utilizar para crear nuestra galería de imágenes responsive Aunque, a primera vista, el código que […]
Aplicar efectos de colores con CSS a las imágenes
Aplicar a tus imágenes efectos de colores con CSS Continuamos con efectos sobre imágenes, en este caso, veremos cómo les podemos aplicar efectos de colores con CSS. ¡Vamos a ello! Efectos de colores con CSS: efecto escala de grises Este sencillo efecto hace que tu imagen cambie su color a escala de grises cuando pases […]
Cómo hacer zoom en una imagen
Hacer zoom en una imagen (o cualquier otro objeto) Esta semana veremos cómo hacer zoom al pasar el cursor del ratón por encima de una imagen. Continuamos con la serie de efectos sobre imágenes que estamos viendo durante las últimas semanas. En esta ocasión veremos un efecto que me habéis pedido en varias ocasiones, y […]
Flip Card con CSS
Cómo crear un efecto Flip Card para tu web Esta semana aprenderemos a crear un efecto flip card para las imágenes de nuestros WordPress. Este artículo complemente el de la semana pasada donde aprendimos a voltear una imagen. Hacer un efecto de rotación 3d en una imagen Utilizando las propiedades de transformación y de rotación, […]
Cómo voltear una imagen
Efecto voltear una imagen En esta ocasión veremos un efecto muy visual, se trata de voltear una imagen, con lo que daremos un aspecto de 3d bastante llamativo. Como siempre, lo primero que vamos a hacer es utilizar un código CSS bastante sencillo y se lo aplicaremos a una imagen. ¡Vamos a ello!. Código que […]