Энэхүү wikiHow нь Adobe Dreamweaver програмыг ашиглан вэб хуудсанд унах хайрцаг үүсгэхийг заадаг. Унтраах хайрцгууд нь таны вэб хуудсан дээрх зүйлийг дарахад "доош унах" цэсүүд бөгөөд энэ явцад илүү олон сонголтыг санал болгодог.
Алхам
Алхам 1. Dreamweaver төслийг нээнэ үү
Үүнийг хийхийн тулд төслийн файлыг давхар товшино уу. Хэрэв та Dreamweaver -ийн шинэ төсөл үүсгэхийг хүсч байвал оронд нь Dreamweaver -ийг нээнэ үү Файл, дарна уу Шинэ, мөн дэлгэц дээрх зааврыг дагана уу.
Алхам 2. Захиалсан жагсаалт үүсгэх
Унтраах цэс үүсгэхийн тулд танд дор хаяж нэг сумны цэг байх ёстой. Та CSS -ийг унтрааж сумны цэг үүсгэж болно Харах цэсийн зүйлийг сонгоно уу Style Rendering, дарна уу Хэв маягийг харуулах Хэрэв энэ нь шалгагдсан бол), цэг нэмэхийг хүссэн байршлаа дарж, цонхны доод талд байгаа сумны дүрс дээр дарж, цэгийн нэрийг бичнэ үү. Та үргэлжлүүлэхээсээ өмнө CSS -ийг дахин асаах хэрэгтэй.
- Энд байгаа цэгийн нэр нь таны унах цэсийг идэвхжүүлэгчийн үүргийг гүйцэтгэх болно (жишээлбэл, унах цэсийг нээх товчлуур дээр дарах эсвэл товших).
- Унтраах цэс рүү хөрвүүлэхийг хүссэн жагсаалтын зүйл байгаа бол энэ алхамыг алгасаарай.
Алхам 3. Жагсаалтынхаа нэрийг тодорхойл
Дарна уу Код таб дээр дарж, байгаа эсэхээ шалгаарай Эх код тохиргоог хийж, дараа нь захиалсан жагсаалтын код руу гүйлгэнэ үү (энэ нь хооронд байх болно.
"хаяг ба"
"tag) дээр дараад" "дээрээс" гэсэн шошгыг хайна уу.
tag. Ишлэлд орсон үг бол таны жагсаалтын нэр юм.
-
Хэрэв та нэр олж харахгүй байгаа бол хаягийн дээр (нэр нь жагсаалтын таны сонгосон нэрийг илэрхийлдэг) шууд оруулна уу
шошго.
Алхам 4. Сум хийх цэг (үүд) -ийг арилга
Та дарж зөв газартаа байгаа эсэхийг шалгаарай Дизайн таб, дараа нь дарна уу CSS дизайнер цонхны баруун дээд буланд байгаа табыг дараад дараахь зүйлийг хийнэ үү.
- Дарна уу + "Сонгогчид" гарчгийн баруун талд.
- #Name ul гэж бичээд "нэр" нь таны жагсаалтын нэр юм.
- ↵ Enter дарна уу.
- Доош гүйлгээд товшино уу жагсаалтын хэв маягийн төрөл цонхны доод талд байгаа самбар дээр CSS дизайнер таб.
- Дарна уу аль нь ч биш гарч ирэх цэс дээр.
Алхам 5. Захиалсан жагсаалтаа хэвтээ байдлаар харуулахаар өөрчил
Үүнийг хийхийн тулд:
- Дарна уу + "Сонгогчид" гарчгийн баруун талд.
- #Name li гэж бичээд "нэр" нь таны жагсаалтын нэр юм.
- Товчлуурын доод хэсэгт байрлах "хөвөх" гарчгийг олоорой CSS дизайнер таб.
- Дарна уу Зүүн "хөвөх" гарчгийн баруун талд байгаа товчлуур.
Алхам 6. Жагсаалтаа идэвхтэй таг нэмнэ үү
Дарна уу + "Сонгогчид" -ын баруун талд байгаа товчлуурыг дараад #name a (энд "нэр" нь таны жагсаалтын нэр) гэж бичээд ↵ Enter дарна уу.
Алхам 7. Арын дэвсгэр өнгө нэмнэ үү
-Г сонгоно уу #нэр a Шаардлагатай бол тухайн зүйлийн дээд хэсэгт байгаа "Арын дэвсгэр өнгө" табыг дарна уу CSS дизайнер цонх, сонгоно уу дэвсгэр өнгө сонголтыг сонгоод ашиглах арын өнгийг сонгоно уу.
Энэ бол таны унах жагсаалтын зүйлүүдийг ашиглах өнгө юм
Алхам 8. Жагсаалтынхаа зүйлсийг "блок" форматыг ашиглан хий
Энэхүү формат нь хэн нэгэн жагсаалтанд байгаа зүйл дээр дарах эсвэл дарах үед текстийг яг нарийн сонгохын оронд дээрээс нь бага зэрэг сонгох замаар нээх боломжтой болно.
- Таны эсэхийг шалгаарай #нэр a доторх зүйлийг сонгосон болно CSS дизайнер таб.
- Хэсгийн "дэлгэц" гарчиг руу доош гүйлгэнэ үү.
- "Дэлгэц" гарчгийн баруун дээд буланд, дараа нь дарна уу блок гарч ирэх цэсэнд.
Алхам 9. Шаардлагатай бол дүүргэгчийг нэмнэ
Хэрэв та жагсаалтын зүйлүүд хоорондоо гацаж байгааг анзаарсан бол та дараах зүйлсийг хийснээр тэдгээрийн хооронд зай тавьж болно.
- Таны эсэхийг шалгаарай #нэр a доторх зүйлийг сонгосон болно CSS дизайнер таб.
- Хэсэг дэх "бөглөх" гарчиг руу доош гүйлгэнэ үү.
- Доод ба доод талын "px" текст талбарыг өөрчилж 5 -аас доошгүй уншина уу.
- Зүүн ба баруун талын "px" текст талбарыг өөрчилж, хамгийн багадаа 10 -г уншина уу.
Алхам 10. Хулсан өнгө үүсгэх
Энэ бол хулганы курсороо доош унах цэс дээрх зүйл дээр дарахад гарч ирэх өнгө юм.
- Дарна уу + "Сонгогчид" гарчгийн баруун талд.
- #Nave a: hover гэж бичээд ("нэр" нь таны жагсаалтын нэр юм) ↵ Enter дарна уу.
- "Арын дэвсгэр өнгө" таб дээр дарна уу.
- Сонгоно уу дэвсгэр өнгө дараа нь арын өнгийг ашиглахаас илүү цайвар өнгийг сонгоно уу.
Алхам 11. CSS -ийг унтраа
Дарна уу Харах цэсийн зүйлийг сонгоно уу Style Rendering, дарна уу Хэв маягийг харуулах гарч ирэх цонхон дээрх сонголт.
Хэрэв Хэв маягийг харуулах Саарал өнгөтэй бол Dreamweaver баримт бичгийн аль ч хэсэгт дараад дахин оролдоно уу.
Алхам 12. Унждаг цэсийн агуулгыг үүсгэнэ үү
Та үүнийг унах цэсийн товчлуур болгон ашиглахыг хүссэн сумныхаа доор дэд цэгүүдийг нэмж оруулах замаар хийж болно.
- Унтраах цэс болгон хувиргахыг хүссэн жагсаалтын зүйлийн баруун талд дарж ↵ Enter дарна уу.
- Tab ↹ дарна уу.
- Унтраах цэсийнхээ эхний зүйлийн нэрийг бичээд ↵ Enter дарна уу.
- Дараагийн унах цэсийн нэрийг бичээд ↵ Enter дарж шаардлагатай бол давтана уу.
Алхам 13. Унждаг цэсийн агуулгыг сумтай холбоно уу
Үүнийг хийхийн тулд:
- Дарна уу + "Selectors" -ын хажууд, #name ul ul гэж бичээд ↵ Enter дарна уу.
- Доош гүйлгээд товшино уу дэлгэц, дараа нь дарна уу аль нь ч биш попап цэсэнд.
- Олоод дарна уу байрлал, дараа нь дарна уу үнэмлэхүй попап цэсэнд.
Алхам 14. Унждаг цэсийг өөрөө үүсгээрэй
Үүнийг хийхийн тулд өөр сонгогч нэмэх шаардлагатай болно.
- Дарна уу + "Сонгогчид" -ын хажууд #name ul li: hover> ul гэж бичээд ↵ Enter дарна уу.
- Олоод дарна уу дэлгэц, дараа нь дарна уу блок гарч ирэх цэс дээр.
Алхам 15. Унждаг цэсийн агуулгыг босоо байдлаар харуулна
Анхдагч байдлаар, унах цэсийн агуулга нь хэвтээ бааранд харагдана, гэхдээ та дараах зүйлийг хийснээр тэдгээрийг босоо багана руу оруулах боломжтой.
- Дарна уу + "Сонгогчид" -ын хажууд, #name ul ul li гэж бичээд ↵ Enter дарна уу.
- "Хөвөх" гарчгийг олоорой.
- "Байхгүй" дээр дарна уу () "хөвөх" гарчгийн баруун талд байрлах сонголт.
Алхам 16. Төслөө хадгална уу
Үүнийг хийхийн тулд Ctrl+S (Windows) эсвэл ⌘ Command+S (Mac) дарна уу.