Formatering av lister og tabeller er en viktig del av å vise informasjon på nettstedet ditt. CSS gir egenskaper og klasser for å lage og tilpasse lister og tabeller til din smak. Her er en detaljert veiledning for hvordan du formaterer lister og tabeller i CSS.
Formatering av lister
Uordnet liste(ul)
Hovedegenskap: liste-stil-type.
Verdier: none, disc, circle, square
.
Eksempel:
Bestilt liste(ol)
Hovedegenskap: liste-stil-type.
Verdier: ingen(standard), desimal, nedre alfa, øvre alfa, nedre romersk, øvre romersk.
Eksempel:
Definisjonsliste(dl)
Hovedegenskap: Det er ingen spesifikk CSS-egenskap for å formatere definisjonslister. Du kan imidlertid style elementene i listen ved å bruke klasser eller andre egenskaper som f.eks font-size, font-weight, margin, padding, etc.
Eksempel:
Formatering av tabeller
Formatering av tabellstruktur
Hovedeiendom: border-collapse
.
Verdier: separate(default), collaps
e.
Eksempel:
Formatering av tabellkanter
Hovedeiendom: border
.
Verdier: En grenseverdi, for eksempel: 1px solid black
.
Eksempel:
Formatering av cellekant
Hovedeiendom: border
.
Verdier: En grenseverdi, for eksempel: 1px solid black
.
Eksempel:
Justering og avstand mellom tabellceller
Hovedegenskaper: text-align, padding
.
- tekstjustering: Justeringsverdier, for eksempel:
left, right, center
. - padding: Avstandsverdi i celler, for eksempel: 10px.
Eksempel:
Bakgrunn og tekstfarge i tabeller
Hovedegenskaper: background-color, color
background-color
: Bakgrunnsfargeverdi, for eksempel:lightgray
.color
: Tekstfargeverdi, for eksempel:white
.
Eksempel:
Kolonne og radstørrelse i tabeller
Hovedegenskaper: width
, height
.
width
: Breddeverdi, for eksempel: "100px", "20%".height
: Høydeverdi, for eksempel: "50px", "10%".
Eksempel:
Dette er en omfattende guide for hvordan du formaterer lister og tabeller i CSS. Du kan tilpasse verdiene og egenskapene for å lage liste- og tabellstiler som passer dine designbehov på nettstedet ditt.