HTML5-ын байршуулагч холбоосын эхлэл гарын авлага

HTML5 агуулах холбоосууд гэж юу вэ?

HTML5 хүртэл idUp, хаяг нь нэг шинж чанарыг шаарддаг: href. Гэхдээ HTML5 нь тэрхүү аттрибутыг заавал хийдэг. Ямар ч шинж чанаргүйгээр шошгыг бичиж байх үед үүнийг агуулагч холбоос гэж нэрлэдэг.

Байршуулагч холбоос нь иймэрхүү байна:

өмнөх

Хөгжлийн үе дэхь байршлын холбоосыг ашиглах

Бараг бүх вэб дизайнер нь вэбсайтаа дизайн хийх, бий болгохын зэрэгцээ байршуулагч холбоосыг үүсгэсэн. HTML5-ээс өмнө бид дараах зүйлийг бичих болно:

холбоос текст

байршуулагчийн хувьд. Тэгээд би эдгээр байршуулагчтай түншүүд рүү илгээсэн сайтуудыг зөвхөн "яагаад текст дээрх холбоосууд ажилладаггүй гэж?"

Байршлын холбоосоор hashtag (#) ашиглахад асуудал нь холбоосыг дарж болох тул энэ нь таны үйлчлүүлэгчдэд төөрөгдөл үүсгэж болзошгүй юм. Мөн хэрэв хэн нэгэн зөв URL-уудыг шинэчлэхээ мартсан бол тэдгээр холбоосууд нь шууд сайт дээр эвдэрч гарч болзошгүй тул тэд ямар ч холболт байхгүй байна.

Харин та ямар ч шинж чанаргүй хаягуудыг ашиглах хэрэгтэй. Та эдгээр хуудсуудыг өөрийн хуудсан дээрх бусад холбоос шиг харагдуулах боломжтой, гэхдээ тэдгээр нь зүгээр л байршуулагч учраас тэдгээрийг товшино болно.

Live Sites дээр байршуулагч линк ашиглах

Гэхдээ байршуулагч холбоос нь зөвхөн вэбсайтын дизайнер дээр зөвхөн хөгжүүлэлт хийхээс илүү байршилтай байдаг. Байршлын холбоосыг гэрэлтүүлж болох нэг газар нь навигаци юм. Ихэнх тохиолдолд вэбсайтны навигацын жагсаалтууд нь аль хуудсанд байгаа болохыг зааж өгдөг. Эдгээрийг ихэвчлэн "та энд байна" гэж нэрлэдэг.

Ихэнх сайтууд "энд байна" тэмдгийг шаарддаг элементийн ID шинж чанарт тулгуурлаж байдаг, зарим нь бас ангийн шинж чанарыг ашигладаг. Гэсэн хэдий ч, та ямар ч шинж чанарыг ашиглаж байгаа бол, дээр нь залуурдлагатай хуудас бүр дээр олон ажил хийх хэрэгтэй, зөв ​​элементүүд нь шинж чанарыг арилгах, устгах хэрэгтэй.

Байрлуулагчийн холбоосоор та хүссэн үедээ залуурдахаа бичиж болно, тэгээд дараа нь хуудас руу залгахдаа нэмэхийн тулд href атрибутыг зохих холбоосоос хасч болно. Би өөрийн бүх засварлагчдын жагсаалтыг миний редактор дээрээ хадгалдаг учраас энэ нь зүгээр л түр зуур хуулж, дараа нь href-г устга. Та мөн CMS-ийг ижил зүйлийг хийх боломжтой.

Үүнээс гадна тусгай загварыг (өөрөөр хэлбэл доороос нь харуулъя) placeholder холбоосыг нэмэхээс гадна холбоосыг товшдоггүй. Тиймээс хэрэв тэд одоо байгаа газрын зургийн холбоос дээр дарвал тэд өөр зүйл авах боломжтой гэж бодож байна.

Styling Placeholder Links

Байршлын холбоосууд нь таны вэбсайт дахь бусад холбоосуудаас өөр хэв маягаар хэв маягаар хэвшмэл ойлголттой байдаг. Зөвхөн хаяг болон a: холбоосын шошготойгоор загварчлах хэрэгтэй. Жишээлбэл:

a {color: red; фонт-жин: зоримог; текст-чимэглэл: none; } a: link {color: blue; фонт-жин: хэвийн; текст-чимэглэл: underline; }

Энэ CSS нь товчлуургүй улаан, тод улаан зургийг байрлуулах болно. Ердийн холбоосууд нь хэвийн жинтэй, цэнхэр, доогуур зураастай байдаг.

Та хаягнаасаа авч явахыг хүсэхгүй байгаа ямар ч загварыг дахин тохируулахаа мартуузай. Жишээлбэл би фонтыг жингийн холбоосоор зоригтойгоор байрлуулсан тул үүнийг дараах байдлаар тохируулсан:

фонт-жин: хэвийн;

стандарт холболтын хувьд. Текст-чимэглэлтэй адилхан сонгон шалгаруулагчаар үүнийг устгаснаар үүнийг мөн адил арилгаж болно: холбоос сонгогчийг би буцааж тавиагүй бол хасагдсан болно.