Меню түзүү сайттардын жана программалардын өнүгүшүндөгү негизги пункттардын бири болушу мүмкүн. Мындан тышкары, мындай менюнун жакшы иштелип чыгышы жана логикалык дизайны сайттын же кандайдыр бир программанын жүзү болуп саналат. Мисалы, Microsoft жана Windows 7 операциялык тутумун алалы, Windows 7 чыккандан кийин, Microsoft өзү үчүн кошоматчыл болбогон көптөгөн сындарды укту. Көптөгөн сын-пикирлер болгон, бирок көбүнчө ыңгайсыз абалда жайгашкан меню пункттары. CSS жана Expression Web менен горизонталдык ачылуучу менюну кантип түзүү керектиги жөнүндө окуу куралын жакшылап окуп чыгыңыз. Тег стилдери менюну түзүү үчүн өзгөрөт
Нускамалар
1 кадам
Стилдерди башкаруу бөлүмүнө өтүп, Жаңы стиль баскычын чыкылдатыңыз. Жаңы эле жараткан стилге Selector ul li деген ат коюңуз. Ошондой эле ачылуучу.css файлында жаңы стиль аныкталууга тийиш экендигин унутпаңыз.
2-кадам
Горизонталдык менюну сунуу үчүн, меню пункттарына анын горизонталдуу болорун айтышыңыз керек. Андан кийин, ар бир меню пунктунун туурасын аныктап, бардык тизме пункттарынын алдында керексиз чекиттерди алып салыңыз.
3-кадам
Горизонталдык тегиздөө үчүн Макетке өтүп, дисплей атрибутун сапка коюңуз. Float атрибутун солго коюңуз. Колдонуу баскычын чыкылдатыңыз. Бардык тизмелер бир сапка коюлушу керек. Алардын бири-бирине дал келбеши үчүн, төмөнкүлөрдү жасашыңыз керек: width атрибутунун Position маанисин 150px кылып коюңуз. Эми текшерип көрүңүз. Тизменин бардык элементтери бирдей өлчөмдө болуш керек.
4-кадам
Эми тизме элементтеринин алдындагы чекиттерди алып салууга аракет кылышыбыз керек. Бул үчүн, Тизмеге өтүп, list-style –type атрибутун эч кимге койбоңуз.
5-кадам
Бардык өзгөртүүлөрдү кабыл алуу үчүн ОК баскычын чыкылдатыңыз.
6-кадам
Ариптин өлчөмүн ul li стилине ылайыкташтыруу үчүн төмөнкүлөрдү жасашыңыз керек. Стилдерди башкаруу бөлүмүндө, ул. Стилин оң баскыч менен чыкылдатып, Стилди өзгөртүү тандаңыз. Атрибуттарды кошуу же өзгөртүү үчүн тааныш диалог терезеси ачылат. Арип категориясына өтүп, Arial, Helvetica, sans-serif деп арип-үй-бүлө атрибутун орнотуңуз. Андан кийин, шрифт өлчөмүндөгү атрибутка өтүп, аны 0,9em кылып коюңуз. Андан кийин, текстти өзгөртүү атрибутун орнотуп, анын маанисин чоң тамгага коюңуз.
7-кадам
Түзүлгөн менюдагы пункттардын бийиктигин Позиция категориясында жөндөсө болот. Бийиктиктин атрибутун 30px кылып койду.
8-кадам
Андан кийин menu.html файлын сакташыңыз керек. Бул үчүн, Expression Web файлды сактоо үчүн талап кылынган камтылган файлдарды сактоо терезесин ачат. Drop-down.css файлында сактаңыз. Сактоо үчүн ОК баскычын чыкылдатыңыз.
9-кадам
Эми натыйжаңызды текшериңиз. Ишенимдүүлүк үчүн аны ар кандай браузерлерде сынап көргөн жакшы. Демейки браузерде алынган натыйжаны текшерүү үчүн, клавиатураңыздагы F12 баскычын басуу керек.
