Құзыретті HTML кодының және қарапайым CSS ережелерінің көмегімен қалқымалы мәзір құруға, оны толықтыруға және өзгертуге болады. Каскадтық кестелер мен белгілеу тілдік құралдарын қолдана отырып, мәзірдің өзі барлық браузерлерде дұрыс жұмыс істейтіндігіне көз жеткізуге болады.
Нұсқаулық
1-қадам
Алдымен негізгі мәзір жолын ұстаңыз. Мәтіндік редактордың ішкі мәзірімен арнайы нөмірленген тізім жасаңыз. Осы мақсаттар үшін әдетте «Блокнот» қолданылады. Ішкі мәзір ата-аналар тізімінің элементі ретінде жұмыс істейді. Мысалы: Бірінші ElementFlood ElementFlood Element2Field Element3Field Element4Field Element5
2-қадам
Бұл тізімді бөлек HTML файлында сақтаңыз. Содан кейін.css файлын жасаңыз. Барлық қажетті стиль парақтарын енгізіңіз. Мұны өте мұқият жасаңыз, өйткені бір қате және қалқымалы мәзір дұрыс көрсетілмейді немесе мүлдем жұмыс істемейді.
3-қадам
Оқ тізіміне енгізілген барлық оқтар мен төсемелерді алып тастаңыз. CSS құралдарының көмегімен мәзірдің енін орнатыңыз: ul -style: none; ені: 200px; }
4-қадам
Тізімдегі барлық элементтердің салыстырмалы орнын позиция деп аталатын атрибутпен белгілеңіз: ul li: салыстырмалы; }
5-қадам
Содан кейін тінтуір курсоры элементтің үстінде болған кезде элементтері ата-аналық менюден оңға қарай көрінетін ішкі мәзірді орналастырыңыз: li ul: Absolute; left: 199px; top: 0; display: none; }
6-қадам
Сол атрибут мәзірдің енінен бір пиксельге кіші. Бұл қалқымалы элементтерді екі жақтауларсыз дұрыс орналастыруға мүмкіндік береді. Дисплей атрибуты парақты ашқанда ішкі мәзірді жасыру үшін қолданылады.
7-қадам
Сілтемелерді сәйкесінше CSS параметрлерін пайдаланып стильдеңіз. Дисплейді қосыңыз: бұғаттау параметрі, сілтемелер олар үшін бөлінген барлық орынды алады. Тінтуір меңзері оның үстінде тұрған кезде мәзір пайда болуы үшін келесі кодты енгізіңіз: li: hover ul: block; }
8-қадам
Тізім элементтері мен сілтемелерді қалауыңыз бойынша бейнелеудің қосымша параметрлерін орнатыңыз. Атрибутты.html файлына қосыңыз. Қалқымалы мәзір пайдалануға дайын.
