Skapa punktpunkter i HTML med hjälp av
- taggar.
Att använda punktpunkter hjälper till att bryta upp stora bitar av text och peka ut listor med användbar information. Punktpunkter är lätta att skapa i ordbehandlingsprogram, men när du skriver ett HTML-dokument måste du känna till koden för att skapa dem. Det krävs inte mycket kod för att skapa en punktlista. Slå in varje lista
- eller "oordnad lista"-taggar. Du kan sedan göra vad du vill med punktlistan med hjälp av Cascading Style Sheet-kod.
Steg 1
Skriv texten för dina punktpunkter. Börja varje punkt på sin egen linje. Linda in varje rad
Dagens video
Steg 2
Skapa en tom rad ovanför punktlistan och skriv sedan en öppning
- taggen på den raden. Hitta slutet av din punktlista och skapa sedan en annan tom rad där. Skriv en avslutning
- märka. Här är ett exempel på en kort punktlista med ett ID-attribut:
- Kula ett
- Kula två
Steg 3
Använd "stil" för att skapa din punktlista med CSS-kod. Lägg till CSS-kod mellan taggarna mellan taggarna och, eller så kan du skriva CSS-koden i en extern .CSS-fil och bädda in filen med en tagga så här:. Ändra "path/to/stylesheet.css" med sökvägen till .CSS-filen du skapar. Använd ID eller class-attributet för att välja dina punktlistor, som så:
#mylist li { font-style: kursiv; }
Ovanstående kod väljer alla
Steg 4
Använd egenskapen "list-style" i CSS för att ändra punkttyp. De tillgängliga kultyperna inkluderar öppna cirklar, ifyllda skivor och rutor för icke-numrerade, icke-alfabetiserade listor. Här är ett exempel på fyrkantiga kulor:
#mylist li {list-style: square;}
Dricks
Använd
- tagga istället för
- för att skapa ordnade listor. Du kan sedan ställa in "list-style" typ till olika typer av siffror eller bokstäver.
- tagga en icke-repeterande, vänsterjusterad bakgrundsbild. Lägg till stoppning på vänster sida av varje
- tagga för att flytta texten över, annars överlappar den bilden.
Skapa bildpunkter genom att ange "ingen" för attributet "list-style" och ge sedan varje
