Artículos

  • CSS 0

    Introducción a ITCSS para desarrolladores web

    Hay un montón de métodos distintos para la estructuración del código CSS, y todos ellos funcionan de maneras diferentes. Los más populares son OOCSS y SMACSS, pero también existe un método menos conocido llamado ITCSS (triángulo invertido de CSS) creado por Harry Roberts.

  • CSS 0

    Cómo crear flechas de navegación animadas con Flexslider y CSS3

    Como de costumbre lo primero, por la mañana, leo todo tipo de noticias. Desde noticias del mundo hasta noticias del mundo del desarrollo web. Pues así descubrí un tutorial de CSS3 titulado "Arrow Navigation Styles" en Codrops. Así es como empecé este tutorial.

  • CSS 0

    Crea efectos animados hover atractivos facilmente con CSS3

    ¡Hacer efectos animados hover en CSS3 puede ser muy sencillo! En un artículo anterior, hablé de la librería para animaciones de CSS3 llamada Magic Animations de MiniMAC. Hoy, vamos a utilizarla como motor de animación para aplicar una serie de efectos en el hover de distintas miniaturas.

  • CSS 0

    Cómo enmascarar imágenes con formas y añadirles un efecto zoom

    Hoy os vamos a mostrar cómo enmascarar imágenes con formas y también a añadirles unos cuantos efectos de animación de zoom con sólo HTML y CSS. He visto este tipo de estilos y efectos en muchos portfolios web, seguro que no te resulta extraño. Así que, déjame que te enseñe cómo hacerlo en tu prop...

  • CSS 0

    Cómo crear un simple portfolio responsive con filtros y efectos hover

    Hace unos cuantos meses, para un cliente, cree una página de portfolio con filtros y también con efectos hover para cada uno de los proyectos del propio portfolio. Conseguí esos efectos con CSS3 y con un plugin de jQuery para filtrar y ordenar llamado MixItUp.

  • CSS 0

    Crea estupendas figuras hexagonales con CSS3 puro

    En este tutorial, vamos a crear formas hexagonales que soporten contenido HTML y también imágenes de fondo con CSS3. CSS3 ha sido una revisión increíble en la creación de estilos más avanzados. Nos ha hecho pasar de 20km/h a 200km/h en una sola revisión, introduciendo estupendísimas novedades.

  • CSS 0

    12 librerías de CSS para efectos hover

    Hacer saber a los usuarios claramente en qué partes de la página se puede hacer clic es una parte importante de la usabilidad web. El método más extendido para ello es cambiar el color del texto y subrayarlo. Hoy en día, con CSS, hay un montón de maneras de mostrar efectos hover, particularmente ...

  • CSS 0

    Guía definitiva para entender las pseudo clases de CSS - Parte 2

    Da igual que seas un novato en CSS o un diseñador experimentado, es probable que hayas oído hablar de las pseudo-clases. Las pseudo-clases que más conozcas probablemente sea :hover, con la que podemos dar estilo a un elemento cuando se hace hover, es decir, cuando posamos el ratón o el puntero en...

  • CSS 0

    Cómo esconder texto que hace overflow con CSS

    Como desarrolladores web, debemos desarrollar nuestros sitios para que quepan variables de texto con distintas longitudes. Tienes que estar seguro de que tu diseño se ve bien tanto si el visitante ha ingresado un nombre de usuario de 50 caracteres como si lo hace con uno de 5 caracteres.

  • CSS 0

    Simplifica tus hojas de estilo con las unidades mágicas basadas en el viewport

    Las unidades basadas en el viewport existen desde hace muchos años, pero no por ello estamos acostumbrados a ellas. Ahora están soportadas por la mayoría de los principales navegadores y ofrecen una función única que puede ser muy útil en ciertas situaciones, especialmente las que implican un dis...