Etiqueta: CSS

Elementos de la misma altura en CSS

Hasta hace unos años, la estructura de las páginas web complejas se creaba mediante tablas HTML. Aunque esta solución presenta muchos inconvenientes, su principal ventaja es que todas las columnas que forman la página son de la misma altura. Normalmente, cuando se crea la estructura de una página compleja, se desea que todas las columnas

Continuar leyendo...

Limpiar floats en CSS

La principal característica de los elementos posicionados de forma flotante mediante la propiedad float es que desaparecen del flujo normal del documento. De esta forma, es posible que algunos o todos los elementos flotantes se salgan de su elemento contenedor. La siguiente imagen muestra un elemento contenedor que encierra a dos elementos de texto. Como

Continuar leyendo...

La propiedad hasLayout de Internet Explorer

El navegador Internet Explorer 7 y sus versiones anteriores incluyen decenas de errores relacionados con CSS. La mayoría de esos errores se pueden solucionar con trucos y técnicas que aprovechan otros errores o características del navegador. Además, muchos errores se solucionan gracias a la propiedad hasLayout de Internet Explorer. En efecto, muchas soluciones de los

Continuar leyendo...

La propiedad shorthand en CSS

Algunas propiedades del estándar CSS 2.1 son especiales, ya que permiten establecer simultáneamente el valor de varias propiedades diferentes. Este tipo de propiedades se denominan «propiedades shorthand» y todos los diseñadores web profesionales las utilizan. La gran ventaja de las propiedades shorthand es que permiten crear hojas de estilos mucho más concisas y por tanto,

Continuar leyendo...

Margen, relleno, bordes y modelo de cajas en CSS

La anchura y altura de un elemento no solamente se calculan teniendo en cuenta sus propiedades width y height. El margen, el relleno y los bordes establecidos a un elemento determinan la anchura y altura final del elemento. En el siguiente ejemplo se muestran los estilos CSS de un elemento: div { width: 300px; padding-left:

Continuar leyendo...

Bordes con CSS

CSS permite definir el aspecto de cada uno de los cuatro bordes horizontales y verticales de los elementos. Para cada borde se puede establecer su anchura, su color y su estilo. Anchura La anchura de los bordes se controla con las cuatro propiedades siguientes: <- Scroll Horizontal disponible en esta tabla -> border-top-widthborder-right-widthborder-bottom-widthborder-left-width Anchura del

Continuar leyendo...

Margen y relleno en CSS

Margen CSS define cuatro propiedades para controlar cada uno de los márgenes horizontales y verticales de un elemento. <- Scroll Horizontal disponible en esta tabla -> margin-topmargin-rightmargin-bottommargin-left Margen superior Margen derecho Margen inferior Margen izquierdo Valores <medida> | <porcentaje> | auto | inherit Se aplica a Todos los elementos, salvo margin-top y margin-bottom que sólo

Continuar leyendo...

Anchura y altura

Anchura La propiedad CSS que controla la anchura de los elementos se denomina width. <- Scroll Horizontal disponible en esta tabla -> width Anchura Valores <medida> | <porcentaje> | auto | inherit Se aplica a Todos los elementos, salvo los elementos en línea que no sean imágenes, las filas de tabla y los grupos de

Continuar leyendo...

Modelo de cajas en CSS

El modelo de cajas o «box model» es seguramente la característica más importante del lenguaje de hojas de estilos CSS, ya que condiciona el diseño de todas las páginas web. El modelo de cajas es el comportamiento de CSS que hace que todos los elementos de las páginas se representen mediante cajas rectangulares. Las cajas

Continuar leyendo...

Colores con CSS

Los colores en CSS se pueden indicar de cinco formas diferentes: palabras clave, colores del sistema, RGB hexadecimal, RGB numérico y RGB porcentual. Aunque el método más habitual es el del RGB hexadecimal, a continuación se muestran todas las alternativas que ofrece CSS. CSS define 17 palabras clave para referirse a los colores básicos. Las

Continuar leyendo...