Kuinka rakentaa navigointipalkki

Navigointipalkit

Siirtymispalkit ovat erittäin tärkeä elementti mille tahansa verkkosivustolle. Ne tarjoavat navigoinnin päämenetelmän tarjoamalla päälistan käyttäjälle johtavista linkeistä. Navigointipalkin luomiseen on monia tapoja. Helpoin tapa luoda siirtymispalkki on käyttää järjestämätöntä luetteloa ja muotoilla se CSS: llä.

Navigointipalkit koostuvat enimmäkseen

    luettelot, jotka on järjestetty vaakasuoraan ja tyyliltään.

    Suunnitellessasi navigointipalkkeja, on tavallista poistaa

      ja
    • tunnisteet sekä luettelomerkit, jotka lisätään automaattisesti:

       list-style-type: none; margin: 0px; padding: 0px;

      Esimerkki:

      Missä tahansa navigoinnissa on kaksi osaa: HTML ja CSS. Tämä on vain nopea esimerkki.

      
             
      • Home
      • About
      • Contact
      /* Define the main Navigation block */ .myNav { display: block; height: 50px; line-height: 50px; background-color: #333; } /* Remove bullets, margin and padding */ .myNav ul { list-style: none; padding: 0; margin: 0; } .myNav li { float: left; /* Or you can use display: inline; */ } /* Define the block styling for the links */ .myNav li a { display: inline-block; text-align: center; padding: 14px 16px; } /* This is optional, however if you want to display the active link differently apply a background to it */ .myNav li a.active { background-color: #3786E1; }