Box model: Manejando tamaños con height y width

En CSS hay propiedades que permiten modificar las dimensiones de las cajas de contenido. Recordad que en CSS una caja es cualquier elemento del código HTML. Este post hablará de cómo usar las propiedades height y width y sus variantes. Height y width Se puede fijar el ancho y el …

Box model en CSS: La propiedad margin

Había comentado en un anterior post  que el box model es un concepto para determinar como los elementos se posicionan dentro de un navegador. En este post hablaré de la siguiente propiedad importante del modelo de cajas, la propiedad margin. La propiedad margin permite controlar el espacio entre cajas, y su …

Box model en CSS: Border y padding

Antes de tratar las propiedades border y padding, explicaré por encima en que consiste el Box model. El Box model o modelo de cajas es un concepto de CSS que determina como los elementos están posicionados dentro del navegador. El nombre es causa de que CSS trate cada elemento como si …

Pseudo-clases en CSS

Las pseudo-clases permiten definir el estado especial de un elemento. En este post hablaré de pseudo-clases basados en atributos, interacción del usuario y de control de formulario. Todavía quedarían por tratar las pseudo-clases estructurales que las dejaré para otro post. :enabled Permite seleccionar un elemento que esté activo. Por defecto …

Selectores avanzados de CSS

Como mencioné en el post anterior, los selectores especifican que elementos queremos modificar. En este post hablaré de los selectores avanzados que serán de ayuda si no queremos usar varios id o clases para dar estilo. Selector hijo No confundir con selector descendiente. Este selector solo hace referencia al hijo directo …

Selectores básicos de CSS

Los selectores especifican que elementos queremos modificar. En esta introducción hablé de la estructura básica de una regla en CSS. En este post hablaré de los selectores básicos de los cuales ya habrás visto alguno si sigues este blog. Selector universal Se representa con un asterisco y sirve para hacer …

Dar formato al texto con CSS

Además de poder modificar propiedades de la fuente, como se vió en este tutorial, se puede cambiar las propiedades que afectan al aspecto del texto, independientemente de la fuente que tenga. Este post tratará de todas las propiedades que podemos modificar en un texto. Color Espefecifica el color del texto. Su …

Modificando las fuentes con CSS

La fuente en un página web puede dar la sensación de que no tiene un rol fundamental, sin embargo tiene un papel importante tanto en diseño como en funcionalidad. El diseño de una página web puede verse marcada por el estilo de fuente que se use. Antes de continuar hay que considerar …

Qué es CSS (Cascading Style-Sheet) y cómo funciona?

Este post explica qué es CSS y cómo podemos implementarlo en nuestra página web. CSS (Cascading Style-Sheet) es un lenguaje de diseño que tiene como funcionalidad proporcionar estilo a las páginas web. Para ello emplea reglas que indican como el elemento en cuestión debe presentarse. Una regla en CSS consta …