Навигационни ленти

Навигационните ленти са много важен елемент за всеки уебсайт. Те осигуряват основния метод на навигация, като предоставят основен списък с връзки към потребител. Има много методи за създаване на лента за навигация. Най-лесният начин да създадете лента за навигация е да използвате неподреден списък и да го оформите с CSS.

Навигационните ленти се състоят предимно от

списъци, които са хоризонтално подредени и стилизирани.

Докато стилизирате навигационните ленти, обикновено се премахва допълнителното разстояние, създадено от

и
• етикети, както и точките, които се вмъкват автоматично:

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

  Пример:

  Всяка навигация има две части: HTML и CSS. Това е само бърз пример.

  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; }