Kā sakārtot neierobežotu sarakstu HTML

Autors: John Stephens
Radīšanas Datums: 2 Janvārī 2021
Atjaunināšanas Datums: 1 Decembris 2024
Anonim
How To Make Drop Down Menu Using HTML And CSS | HTML Website Tutorials
Video: How To Make Drop Down Menu Using HTML And CSS | HTML Website Tutorials

Saturs

Tīmekļa dizaineri izmanto "neierobežotu" vai "grāmatzīmju" sarakstus vairāk nekā tikai grāmatzīmju un teksta pievienošanai. HTML tagu, ko izmanto, lai izveidotu neregulētus sarakstus, var izmantot, lai izveidotu izvēlnes un organizētu attēlus JavaScript, lai tos ielādētu prezentācijā. Mācīšanās, kā izmantot CSS (kaskādes stilu) kopā ar šiem sarakstiem pavērs daudzas tīmekļa dizaina iespējas. Neregulētu sarakstu saskaņošana ir ļoti svarīga prasme uzlabot.


Instrukcijas

Izmantojiet CSS kodu, lai saskaņotu neierobežotus sarakstus HTML (Jupiterimages / Photos.com / Getty Images)
  1. Atveriet HTML failu, kurā ir neierobežots saraksts, un apskatiet tagus un , koda augšdaļā. Pievienojiet tagus> un ja tie vēl nav klāt. Ja jūsu kods ietver tagu

  2. kaut kur pēc tā, un tajā ir atsauce uz CSS failu, atveriet šo failu. Jūsu CSS kods iet starp> un vai jaunā CSS faila rindā.

  3. Izlīdziniet tekstu grāmatzīmēs, iestatot atzīmes "teksta saskaņošanu"

      . Tas ietver tagus
    • un
    • definēt tos kā daļu no viena saraksta. Kad saskaņojat tagu
        , visi saraksta elementi tiks ietekmēti, bet ne pats saraksts, lapas kreisajā vai labajā pusē. Piemērs, kā izmantot CSS kodu, lai iestatītu "text-align" īpašumu, izmantojiet "ul {text-align: right;}". Ņemiet vērā, ka marķieri nepārvietosies ar tekstu. Šajā gadījumā tie būs kreisajā pusē.

  4. Pielāgojiet visu sarakstu pa kreisi vai pa labi no lapas, iestatot atzīmes "float" īpašību

      . Šī īpašība ietekmē visu sarakstu, pārvietojot to uz lapas kreiso vai labo pusi. Uzrakstiet kodu "ul {float: right;}".

      Šo īpašumu var iestatīt pa kreisi vai pa labi, bet ne uz centru.


  5. Ielīmējiet tagus

      ar tagiem un lai izveidotu apvalku, kas centrēs lapu lapā. Kods izskatīsies šādi: "
      • Saraksta elements
      • Saraksta elements
      '.

      Marķējums neko nesaskaņos; jums vajadzētu izmantot CSS visu, lai centrētu visu. Pievienojiet šādu kodu starp> tagiem vai CSS failā, lai centrētu sarakstu: "div {display: block; text-align: center;} ul {display: inline-block; text-align: left;}".