Один з найважливіших аспектів у розробці програм і сайтів - це створення меню. Як яскравий приклад варто взяти компанію Microsoft і її найвідоміше дітище - операційну систему Windows. Незважаючи на те, що даним продуктом користується переважна більшість користувачів ПК у світі, критика не тільки не зменшується, але і постійно зростає. Переважно вона стосується незручності розташування пунктів меню. Далі можна знайти опис створення меню CSS та Expression Web.
Інструкція
1. Щоб почати створення горизонтального меню, перейдіть до Manage Style, потім натисніть кнопку New Style. Присвоюйте новому стилю назву Selector ul li. Важливо! Переконайтеся, що створений файл має розширення drop-down.css. Щоб зробити горизонтальне меню, вкажіть створений елемент, що він буде горизонтальним. Потім визначте ширину кожного пункту меню та вилучіть всі зайві точки, розставлені перед усіма пунктами списку.
2. Перейдіть до параметра Layout, встановіть атрибут Display, надавши йому значення Inline, щоб зробити горизонтальне вирівнювання. Далі додайте значення Left атрибуту Float і натисніть кнопку "Застосувати" - Apply. Встановіть всі елементи списку до одного рядка. Щоб вони розставилися акуратно і не заповзали один на одного, в атрибуті Width встановіть значення Position рівним 150 рх. Будь ласка, перевірте, що всі елементи списку стали однаковими за розміром. Далі приберіть точки перед усіма елементами - для цього перейдіть в атрибут List і в пункті List Style-type встановіть параметр None. Натисніть "OK", щоб всі зміни були прийняті і набули чинності.
3. Налаштуйте розмір та стиль шрифту для ul li. Для цього перейдіть в Manage Styles і клацніть правою кнопкою миші на ul li, після чого виберіть Modify Style. З 'явиться вже знайоме діалогове вікно. Перейдіть до Font, виберіть атрибут Font-family і встановіть для нього значення Sans-serif, Arial, Helvetica. Далі налаштуйте розмір шрифту, встановивши значення 0,9. Після цього для атрибута Text-transform встановіть Uppercase. Скоригуйте висоту пунктів меню в атрибуті Height - Position, виставивши значення 30 рх.
4. Після завершення всіх коригувальних операцій збережіть файл як menu.html. Далі протестуйте створене меню в різних переглядачах, щоб переконатися в коректності його роботи. Як бачите, конструкція горизонтального меню досить проста.