Capítulo 7. Relleno, bordes, contornos y márgenes

Este trabajo se ha traducido utilizando IA. Agradecemos tus opiniones y comentarios: translation-feedback@oreilly.com

En el Capítulo 6, hablamos de los fundamentos de la visualización de elementos. En este capítulo, veremos las propiedades y valores CSS que puedes utilizar para afectar a cómo se dibujan y separan entre sí las cajas de los elementos. Esto incluye el relleno, los bordes y los márgenes alrededor de un elemento, así como cualquier contorno que pueda añadirse.

Cajas de elementos básicos

Como se ha comentado en el capítulo anterior, todos los elementos del documento generan una caja rectangular llamada caja de elemento, que describe la cantidad de espacio que ocupa un elemento en la disposición del documento. Por tanto, cada caja influye en la posición y el tamaño de las cajas de otros elementos. Por ejemplo, si la caja del primer elemento del documento tiene una pulgada de altura, la siguiente caja comenzará al menos una pulgada por debajo de la parte superior del documento. Si la primera caja de elemento se cambia y se hace que tenga 2 pulgadas de alto, cada caja de elemento siguiente se desplazará una pulgada hacia abajo, y la segunda caja de elemento comenzará al menos 2 pulgadas por debajo de la parte superior del documento.

Por defecto, un documento renderizado visualmente se compone de numerosas cajas rectangulares que se distribuyen de forma que no se solapen. Las cajas pueden solaparse si se han colocado manualmente ...

Get CSS: La Guía Definitiva, 5ª Edición now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.