background

background

CSS background

La propietat CSS background controla el fons d'un element i permet configurar colors, imatges, gradients, repeticions, posicionaments, i més.

1. HTML bàsic

<div style="background: #ffcc00; width: 100px; height: 100px;"></div>

  • Aquí, el color de fons és groc (#ffcc00) aplicat directament amb l'estil en línia.

2. Bootstrap

En Bootstrap, utilitzes classes predefinides per als colors de fons:

<div class="bg-primary text-white">Fons blau Bootstrap</div>

  • Classes populars: bg-primary, bg-secondary, bg-success, bg-danger, etc.
  • Per a imatges o gradients, s'utilitzen estils CSS personalitzats.

3. UIkit

UIkit proporciona classes per a colors de fons i permet usar CSS per a altres personalitzacions:

<div class="uk-background-secondary uk-light">Fons secundari</div>

  • Classes comunes: uk-background-primary, uk-background-secondary, uk-background-muted.

4. Tailwind CSS

En Tailwind, utilitzes classes utilitàries per definir colors i imatges:

<div class="bg-blue-500 text-white p-4">Fons blau Tailwind</div>

  • Classes comunes: bg-red-500, bg-green-200.
  • Per a imatges:
  • <div class="bg-[url('/path/to/image.jpg')] bg-cover h-64"></div>
    

Resum:

  • HTML bàsic: Especifica colors/imatges amb style.
  • Bootstrap: Usa classes predefinides com bg-primary.
  • UIkit: Classes com uk-background-primary.
  • Tailwind CSS: Classes modulars com bg-blue-500.