Slik justerer du en uordnet liste i HTML

Forfatter: John Stephens
Opprettelsesdato: 1 Januar 2021
Oppdater Dato: 3 Kan 2024
Anonim
User Level permission PHP application with PHPMaker
Video: User Level permission PHP application with PHPMaker

Innhold

Webdesignere bruker "unordered" eller "bookmark" lister for mer enn bare å legge til bokmerker og tekst. HTML-koden som brukes til å lage uordnede lister, er nyttig for å lage menyer og organisere bilder for at JavaScript skal kunne legges inn i en presentasjon. Lære å bruke CSS (Cascading Style Sheet) sammen med disse lister vil åpne opp mange webdesign muligheter. Aligning unordered lister er en svært viktig ferdighet å forbedre.


retninger

Bruk CSS-koden til å justere uordnede lister i HTML (Jupiterimages / Photos.com / Getty Images)
  1. Åpne HTML-filen som inneholder den uordnede listen, og se gjennom kodene og , øverst på koden. Legg til tagger> og hvis de ikke allerede er til stede. Hvis koden din inneholder en tagg

  2. et sted etter det, og det inneholder en referanse til en CSS-fil, åpner du den filen. Din CSS-kode vil gå mellom> og eller i en ny linje i CSS-filen din.

  3. Juster tekst i bokmerker ved å angi egenskapen "tekst-justere" på taggen din

      . Dette innebærer kodene
    • og
    • å definere dem som en del av en enkelt liste. Når du justerer teksten i taggen
        , vil alle elementene i listen bli påvirket, men ikke selve listen, til venstre eller høyre på siden. Et eksempel på bruk av CSS-kode for å angi egenskapen "text-align", bruk "ul {text-align: right;}". Merk at markørene ikke beveger seg med teksten. I dette tilfellet vil de være til venstre.

  4. Juster hele listen til venstre eller høyre på siden ved å angi egenskapen "float" på taggen din

      . Denne egenskapen påvirker hele listen ved å flytte den til venstre eller høyre på siden. Skriv koden "ul {float: right;}".

      Du kan sette denne egenskapen til venstre eller høyre, men ikke til sentrum.


  5. Konvolutt kodene dine

      med koder og å lage en pakke som vil sentrere listen på siden. Koden vil se slik ut: "
      • Liste element
      • Liste element
      '.

      Merket vil ikke justere noe av seg selv; du bør bruke CSS til å sentrere alt. Legg til følgende kode mellom> taggene eller i CSS-filen din for å sentrere listen: "div {display: block; text-align: center;} ul {display: inline-block; text-align: left;}".