Чадварлаг HTML код болон энгийн CSS дүрмүүдийн тусламжтайгаар та цэстэй цэс үүсгэж, нэмэлт болгож өөрчлөх боломжтой. Каскадтай хүснэгт, тэмдэглэгээний хэлний хэрэгслийг ашигласнаар та бүх хөтөч дээр цэс өөрөө зөв ажиллаж байгаа эсэхийг баталгаажуулж чадна.
Зааварчилгаа
1-р алхам
Эхлээд үндсэн цэсний мөрийг барь. Текст редактор дээр дэд цэсээр тусгай дугаарласан жагсаалт үүсгэх. Эдгээр зорилгоор ихэвчлэн "Тэмдэглэлийн дэвтэр" ашигладаг. Дэд цэс нь эцэг эхийн жагсаалтын элементийн үүрэг гүйцэтгэдэг. Жишээлбэл: First ElementFlood ElementFlood Element2Field Element3Field Element4Field Element5
Алхам 2
Энэ жагсаалтыг тусдаа HTML файлд хадгална уу. Дараа нь.css файл үүсгээрэй. Шаардлагатай бүх загварын хүснэгтийн параметрүүдийг оруулна уу. Үүнийг маш болгоомжтой хий, учир нь нэг алдаа, гарч ирэх цэс зөв харагдахгүй эсвэл огт ажиллахгүй болно.
Алхам 3
Сумны жагсаалтад орсон сум, дэвсгэрийг арилгана уу. CSS хэрэгслийг ашиглан цэсийн өргөнийг тохируулна уу: ul -style: none; width: 200px; }
Алхам 4
Жагсаалтанд байгаа бүх зүйлийн харьцангуй байрлалыг байрлал гэж нэрлэдэг шинж чанараар тэмдэглэ: ul li: харьцангуй; }
Алхам 5
Дараа нь дэд цэсийг байрлуул. Хулганы курсорыг объект дээр дарахад элементүүд нь эх цэснээс баруун талд гарч ирнэ: li ul: absolute; left: 199px; top: 0; display: none; }
Алхам 6
Зүүн атрибут нь цэсний өргөнөөс нэг пикселээр бага байна. Энэ нь хоёр хүрээ үүсгэхгүйгээр попап цонхыг зөв байрлуулах боломжийг олгодог. Дэлгэцийн шинж чанар нь хуудсыг нээхэд дэд цэсийг нуухад ашиглагддаг.
Алхам 7
Холбогдох css тохиргоонуудыг ашиглан шаардлагатай бол холбоосуудыг загварчлах. Дэлгэцийг блоклох параметрийг оруулаарай, ингэснээр холбоосууд нь тэдэнд зориулагдсан бүх зайг эзэлнэ. Хулганы курсор дээгүүр эргэлдэж байх үед цэсийг гаргахын тулд дараах кодыг оруулна уу: li: hover ul: block; }
Алхам 8
Жагсаалтын зүйл, холбоосыг хүссэнээрээ харуулах нэмэлт сонголтыг тохируулна уу.. Html файлд шинж чанарыг оруулна уу. Гарч ирэх цэсийг ашиглахад бэлэн боллоо.
