Brug CSS-kode til at justere punktopstilling i HTML.
Webdesignere bruger punktlister til mere end blot at tilføje punkttegn og tekst. HTML-tagget, der bruges til at oprette punktlister, er praktisk til at oprette menuer eller organisere billeder, så et JavaScript kan indlæses i et diasshow. At lære at bruge cascading style sheet-kode i forbindelse med punktlister - kaldet "uordnede lister" i HTML-slang - vil åbne op for adskillige spændende webdesign-muligheder.
Trin 1
Åbn din HTML-fil, der indeholder punktlisten, og se mellem taggene og mod toppen af koden. Tilføj tags, hvis de ikke allerede er til stede. Hvis din kode indeholder en tag et sted efter tagget, og det indeholder en reference til en CSS-fil, og åbn derefter denne fil i stedet for. Din CSS-kode går mellem tags eller på en ny linje i din CSS-fil.
Dagens video
Trin 2
Juster teksten inden for alle punkttegn ved at indstille "tekstjustering" for din
- tag. Det
- og tags for at definere dem som en del af en enkelt liste. Når du justerer tekst for
- mærket vikler rundt om
- tag, påvirker justeringen teksten i hver punkttegn, men justerer ikke selve listen til venstre eller højre på siden. Her er et eksempel på CSS-kode til at indstille "tekst-align":
ul {tekst-align: højre;}
Bemærk, at punkterne ikke bevæger sig med teksten. Kuglerne forbliver til venstre i dette tilfælde.
Trin 3
Juster hele listen til venstre eller højre på siden ved at indstille "float" for din
- tag. Når "float" er sat til venstre eller højre på en
- tag flytter den hele punktlisten til venstre eller højre på siden. Indstil flyder sådan her:
ul {float: højre;}
Du kan indstille "float" til venstre eller højre, men ikke til midten.
Trin 4
Pak din
- tags ind
og
tags for at oprette en indpakning, der vil centrere punktopstillingen på din side. Din resulterende kode vil se sådan ud:- Listevare
- Listevare
Det
tag centrerer ikke noget af sig selv; du skal bruge CSS til at centrere alt. Tilføj følgende kode mellem din
