Як створити спливаюче меню.

За допомогою грамотного HTML-коду і простих правил CSS можна зробити спливаюче меню , доповнювати його і змінювати. Якщо використовувати засоби каскадних таблиць та мови розмітки, можна у всіх браузерах забезпечити коректну роботу самого меню.
Інструкція
1
Стривайте для початку базову рядок меню. Створіть спеціальний нумерований список з підміню в текстовому редакторі. Зазвичай для цих цілей використовують «Блокнот». Підміню виступає елементом батьківського списку. Наприклад: Перший елементВипадающій елементВипадающій елемент2Випадающій елемент3Випадающій елемент4Випадающій елемент5
2
Даний список збережіть в окремому html-файлі. Потім створіть файл .css. Введіть всі необхідні параметри таблиці стилів. Робіть це дуже уважно, адже одна помилка, і спливаюче меню буде відображатися некоректно або взагалі не буде працювати.
3
Видаліть всі маркери і відступи, застосовувані в ненумерованого списку. Задайте ширину меню за допомогою засобів CSS: ul -style: none; width: 200px; }
4
Відзначте відносне положення всіх елементів списку за допомогою атрибуту під назвою position: ul li: relative; }
5
Потім оформите підміню, елементи якого будуть з'являтися від батьківського меню справа в момент, коли курсор мишки буде знаходитися над пунктом: li ul: absolute; left: 199px; top: 0; display: none; }
6
У атрибута left значення на один піксель менше, ніж у ширини самого меню. Це дозволяє правильно розташувати спливаючі пункти без створення подвійних кордонів. Атрибут display використовується, щоб при відкритті сторінки приховати підменю.
7
Задайте необхідні стилі для посилань за допомогою відповідних параметрів css. Підключіть параметр display: block, щоб посилання займали всі відведені для них місця. Для того щоб меню з'являлося в момент, коли курсор миші буде надаватися над ним (hover), введіть такий код: li: hover ul: block; }
8
За бажанням задайте додаткові параметри для відображення елементів списку і посилань. Включіть в файл .html атрибут. Спливаюче меню готове до застосування.