Published on

Properties in CSS

Authors
  • avatar
    Name
    Diego Whiskey
    Twitter

Las propiedades CSS son reglas que se utilizan para definir el estilo de los elementos HTML en una página web. Estas propiedades determinan aspectos como el color, la tipografía, el tamaño, el diseño y la posición de los elementos. A continuación, una lista de propiedades CSS junto con una breve descripción de su función:

  1. color: Define el color del texto.

  2. font-family: Especifica la fuente de la tipografía a utilizar.

  3. font-size: Establece el tamaño de la fuente.

  4. font-weight: Controla el grosor de la fuente (p. ej., normal, bold).

  5. line-height: Define la altura de línea, que es la distancia entre líneas de texto.

  6. text-align: Determina la alineación del texto en un elemento (izquierda, derecha, centrado, justificado).

  7. text-decoration: Controla decoraciones de texto como subrayado o tachado.

  8. text-transform: Cambia el capitalizado del texto (mayúsculas, minúsculas, capitalización).

  9. background-color: Establece el color de fondo de un elemento.

  10. border: Combina propiedades para crear bordes alrededor de un elemento.

  11. margin: Controla los márgenes externos de un elemento.

  12. padding: Define los márgenes internos de un elemento.

  13. width: Especifica el ancho de un elemento.

  14. height: Establece la altura de un elemento.

  15. display: Controla cómo se muestra un elemento en el flujo del documento (p. ej., block, inline, inline-block).

  16. position: Define el método de posicionamiento de un elemento (static, relative, absolute, fixed).

  17. top, right, bottom, left: Utilizadas con elementos posicionados, definen su posición con respecto al contenedor padre.

  18. float: Permite que un elemento flote a la izquierda o a la derecha de su contenedor.

  19. clear: Controla cómo los elementos deben comportarse en relación con los elementos flotantes.

  20. z-index: Define la pila de contexto de posicionamiento de un elemento.

  21. box-sizing: Controla cómo se calcula el tamaño total del elemento, incluyendo el relleno y los bordes (content-box, border-box).

  22. overflow: Determina cómo se maneja el contenido que desborda el área de un elemento.

  23. text-overflow: Controla cómo se muestran los textos que desbordan su contenedor.

  24. white-space: Define cómo se maneja el espacio en blanco en el texto.

  25. visibility: Controla la visibilidad de un elemento.

  26. opacity: Define la transparencia de un elemento (valores de 0 a 1).

  27. background-image: Especifica una imagen de fondo para un elemento.

  28. background-repeat: Controla la repetición de una imagen de fondo.

  29. background-position: Define la posición inicial de una imagen de fondo.

  30. box-shadow: Agrega sombras a un elemento.

  31. border-radius: Crea esquinas redondeadas en un elemento.

  32. text-shadow: Agrega sombras al texto.

  33. transform: Aplica transformaciones (rotación, escalado, traslación) a un elemento.

  34. transition: Define transiciones suaves para cambios de estado.

  35. animation: Permite crear animaciones complejas en elementos.

Estas son solo algunas de las muchas propiedades CSS disponibles. Cada propiedad tiene un propósito específico y puede combinarse con otras para personalizar completamente el aspecto y la presentación de los elementos en una página web. El conocimiento y la comprensión de estas propiedades son esenciales para el diseño y la maquetación web efectivos.