Google nos da la oportunidad de usar diferentes tipos de letras en nuestro sitio web a través de su banco de tipografías gratuitas. Y lo hace de una manera muy sencilla que vamos a aprender en este post. Conociendo el entorno de Google Fonts Para empezar, vayamos a la página de Google Fonts y veamos … Leer más
Las unidades de medida en CSS son muchas y se representan mediante un número seguido de su unidad de medida (sin espacios). Normalmente las vemos y usamos a menudo en el modelo de cajas, pero lo cierto es que están presentes en prácticamente todo el proyecto CSS. Por lo que las veremos en propiedades como … Leer más
Esta es la definición exacta que nos proporciona su página oficial de PostCSS en GitHub. Estos plugins transforman tu CSS en una hoja de estilos que interpretará tu navegador. Pueden soportar variables y mixins, compilar sintaxis CSS del futuro, imágenes en línea y mucho más. Así parece todo muy bonito, pero… ¿para qué sirve realmente … Leer más
Para crear un párrafo repartido en diferentes columnas y sin la necesidad de repartir el texto contamos con la propiedad column-count y column-gap. column-count: detallamos el número de columnas que necesitamos.column-gap: espacio entre las columans. Mejor lo vemos con un ejemplo: Este es el html del párrafo que queremos dividir. <p>Lorem ipsum dolor sit amet, … Leer más
El texto de placeholder en las celdas de formularios (input) viene por defecto en un tono gris claro.
LESS actúa como herramienta para crear CSS con variables, operaciones, reglas anidadas o funciones, por citar algunos ejemplos.
Seguro que has oído hablar de los CSS Sprites. Si es así apuesto a que los utilizas en tus páginas web, y si no, es el momento de empezar a hacerlo y te voy a dar unas cuantas razones para ello. Los CSS sprites es una técnica que se empezó a utilizar por los desarrolladores … Leer más
Con este último post de la serie aprenderemos a maquetar el pie de página y con ello tendremos nuestro psd convertido en un html y css completamente.
Si hace unos días aprendíamos cómo utilizar y añadir Google Web Fonts a nuestra página web, hoy le toca el turno a Adobe Edge Web Fonts, un servicio que nos permite disponer de cientos de tipografías gratuitas para nuestra página web. Adobe Edge Web Fonts es una aplicación que nos ofrece un catálogo de unas 500 fuentes para ser usadas … Leer más
En esta ocasión vamos a maquetar varias columnas en una página con HTML y CSS. Además, con la peculiaridad de que cada una tiene un ancho (width) diferente… Ya verás qué fácil 😉 Según nuestro archivo psd y ayudándonos de las guías, las columnas miden lo siguiente en ancho: Columna Izquierda: 221px. Columna Central: 326px. … Leer más
Incluir videos de vimeo o YouTube en tu página web es de lo más sencillo, ya verás. 😀
Ve al enlace del vídeo de Vimeo que quieres introducir en tu página web.
Como ejemplo yo he elegido el siguiente: http://vimeo.com/39645824
Haz clic en el botón «share» que está justo en la parte superior derecha del vídeo.
Las propiedades de la etiqueta background se utilizan para dar efectos en el fondo de los elementos. Son 5, las diferentes propiedades con las que cuenta esta etiqueta. background-color background-image background-repeat background-attachment background-position En esta entrada vamos a explicar algunas de las diferentes formas de utilizar esta etiqueta y sus propiedades. Como ejemplo tenemos el … Leer más
