El poder de CSS combinado con algo de creatividad puede dar resultados sorprendentes. La idea es muy básica, usar los pseudoelementos :before y :after para crear iconos… pero el poder de CSS da para mucho más.
Seguir leyendo
Iconos con CSS
Etiqueta » Responsive7
Afinador de Guitarra – Online Guitar Tuner
Hace unos años hice un Afinador de Guitarra Online en Flash para la web de Liyonel Guitars.
Flash va a morir, de hecho está agonizando ya… en el año 2016 estuvo presente solo en el 10% de las webs y a partir de 2017 Firefox y Chrome empezarán a bloquear el contenido Flash.
Seguir leyendo
Flip Cards o Tarjetas Giratorias con CSS3
Un efecto cada vez más usado el de las “Flip Cards”, muy vistoso y con muchas posibilidades, para muestra este codepen de Virgil Pana, donde exprime esas posibilidades al máximo.
Nosotros vamos a ver algo más simple y no usaremos Javascript para hacer los efectos de giro, solo usaremos transiciones de CSS3.
Efecto “Before / After” Responsive
HTML5 incorpora nuevos tipos de input. Uno de ellos, range, es el protagonista de esta demo. Con él podemos seleccionar y modificar valores dentro de un rango. En este artículo vamos a usar HTML HTML5, CSS, CSS3 y algo de Javascript.
Diseño responsive con [@media] queries de CSS3
El Diseño Web Adaptativo o RWD (Responsive Web Design) es un estándar recomendado por el W3C desde junio del 2012 cuyo objetivo es adaptar la apariencia de las páginas web al dispositivo que se esté utilizando para visualizarla. Uno de los pilares de esta filosofía es la regla @media de CSS3.
Seguir leyendo
Estructura básica de CSS
CSS son las siglas en inglés de Cascade Style Sheet. La traducción al castellano sería Hoja de Estilo en Cascada y es lo que utilizaremos para aplicar estilos en nuestras páginas web.
Seguir leyendo
Estructura básica de HTML
Todo documento HTML debe tener una estructura específica que se puede separar en cuatro partes bien diferenciadas:
El DOCTYPE, y las etiquetas html, head y body.
Seguir leyendo