Hvordan lage en vertikal linje mellom menyer

Vertikale linjer er opprettet mellom elementer i en horisontal nettside meny som separatorer. Linjene hjelpe brukere å skille hvor en navigasjonskobling område slutter og den neste koblingen begynner, spesielt når menyelementer er nær hverandre på grunn av layout begrensninger. Menyene er vanligvis laget ved hjelp av CSS for å style en sorterte liste. Du kan lage en vertikal linje mellom menyelementer ved å legge en ramme til den ene siden av listen-elementet tag ved hjelp av CSS.

Bruksanvisning

1 Åpne din webside ved å høyreklikke på den og deretter klikke "Åpne med." Klikk for å velge "Notisblokk" eller "WordPad". Klikk på "OK".

2 Finn menyen sorterte liste kode. En sorterte liste starter med en "<ul>" tag og slutter med en "</ ul>" tag, mellom hvilke finnes flere sett med "<LI>" og "</ LI>" kodene som brukes for å betegne meny-linker.

3 Klikk for å plassere markøren til venstre for sluttparentesen i en åpning "<LI>" tag. Trykk "Mellomrom".

4 Type "style =" border-right: 1px solid # 000000; ' "for å lage en ramme på høyre side av menyelementet som er en piksel bred, en heltrukken linje, og farget svart (" # 000000 "er den heksadesimale verdien for svart).

5 Bytt ut "1px" verdi i forrige trinn med ønsket vertikal linje bredde. Erstatt "solid" med "prikkete", "double" eller "knust" for å endre den vertikale linjen stil. Erstatt "# 000000" med den heksadesimale fargeverdien du ønsker å endre den vertikale linjen farge.

6 Gjenta trinn 3, 4 og 5 for alle "<li>" koder i menyen, hopper den siste menyvalget er "<LI>" tag. (Lage en ramme på høyre side av siste menyvalget later en hengende loddrett linje på høyre side av menyen.)

7 Klikk "Fil" og "Lagre" for å lagre websiden.