Найти в Дзене
<!Веселый HTML>

Создание навигационного меню

Как и обещал, расскажу вам о создании навигационного меню. Сделаем простую менюшку с помощью тэгов для списков.

Создание менюхи
Создание менюхи

Итак, берем в первую очередь тэг <nav>, потому что он как раз предназначен для создания менюшек. В него помещаем список <ul>. Однако, маркеры нам в этот раз не понадобятся. Для этого нужно применить стиль list-style-type: none для <li>. Теперь самое главное. Допустим, будет 3 раздела (секции). Соответственно будет 3 элемента списка <li>. Но в элементы мы поместим ссылки <a>. Внутри ссылки необходимо указать значение атрибута href. Я рекомендую использовать chapter1, chapter2 и так далее. Эти значения будут выступать в качестве идентификатора для главы. Пишем первый пункт: <li><a href="#chapter1">Глава 1</a></li>.
Теперь создаем главу 1. Она у вас будет после
<header>. Пишем следующим образом: <section id="chapter1">И здесь пишите все, что вам нужно в главе 1</section>. Точно также повторяете с другими главами. Теперь при нажатии на ссылку в пункте меню вы будете перемещаться на эту главу. Можно кстати сделать такое перемещение из другой вкладки сайта, но это сложнее. Проще указать ссылку на документ, как все и делают.

Не забудьте подписаться
Не забудьте подписаться

Можете сохранить себе статью как шпаргалку, потому что тема реально нужная. Если будете рубать веб-страницы, то менюшку часто использовать придется.