- HTML холбоосууд - Гипер холбоосууд
- HTML Холбоосууд- Синтакс(Syntax)
- HTML холбоосууд - Зорилтот(targeted) шинж чанар
- Үнэмлэхүй(Absolute) URL ба харьцангуй(Relative) URL
- HTML холбоосууд - Зургийг холбоос болгон ашигла
- Имайл хаягруу холбоос(link) үүсгэх
- Холбоостой товчлуур
- Холбоостой гарчиг
- Үнэмлэхүй URL ба харьцангуй URL-ийн талаар дэлгэрэнгүй үзэх
- Chapter Summary
Холбоосууд бараг бүх вэб хуудсанд байдаг. Холбоосууд нь хэрэглэгчидийг хуудсаас хуудас руу чиглүүлэх боломжийг олгодог.
HTML холбоосууд – Гипер холбоосууд #
HTML холбоосууд нь гиперхолбоосууд юм.
Та холбоос дээр дарж өөр баримт бичиг рүү үсрэх боломжтой.
Хулганаа холбоос дээр зөөж аваачихад хулганы сум жижиг гар болж хувирна.
Тэмдэглэл: Холбоос заавал текст байх албагүй. Холбоос нь зураг эсвэл бусад HTML элемент байж болно!
#
HTML Холбоосууд- Синтакс(Syntax) #
HTML <a> тэмдэглэгээ нь гиперхолбоосыг тодорхойлно. Энэ нь дараах синтаксуудтай:
<a href="url">link text</a> <a> элементийн хамгийн чухал шинж чанар бол href бөгөөд энэ нь холбоосын очих газрыг заана.
Холбоос текст нь уншигчдад харагдах хэсэг юм.
Холбоос текст дээр дарахад уншигчийг заасан URL хаяг руу илгээх болно.
<a href="apprentice.mn/">Visit Apprentice.mn!</a> Өгөгдмөл байдлаар, холбоосууд бүх хөтөч дээр дараах байдлаар гарч ирнэ:
- Очоогүй холбоос доогуураа зурагдаж, цэнхэр өнгөтэй байна
- Очсон холбоос доогуураа зурагдаж, нил ягаан өнгөтэй байна
- Идэвхтэй холбоос доогуураа зурагдаж, улаан өнгөтэй байна
Зөвлөгөө: Холбоосуудыг CSS-ээр хэв маягыг нь тохируулан өөрөөр харагдаж болно.
HTML холбоосууд – Зорилтот(targeted) шинж чанар #
Үндсэн чанараар холбоосын хуудас одоо байгаа хуудсан дээр нээгддэг. Үүний өөрчилхийн тулд холбоосд өөр зорилт өгөх хэрэгтэй.
The target attribute specifies where to open the linked document.
target шинж чанар нь холбоостой баримтыг хаана нээхийг зааж өгдөг.
targetшинж чанар нь дараах утгуудтай байна
_self– Үндсэн.Одоо байгаа хуудсан дээрээ холбоосыг нээх_blank– Шинэ цонхон дээр холбоосыг нээх_parent– Баримтыг эх суурьт нээх_top– Баримтыг цонхны бүтэн хэсэгт нээнэ
Use target=”_blank” to open the linked document in a new browser window or tab:
<a href="apprentice.mn/" target="_blank">Visit Apprentice!</a> Үнэмлэхүй(Absolute) URL ба харьцангуй(Relative) URL #
Дээрх жишээнүүд үнэмлэхүй URL(Вэбийн бүтэн хаяг)-ийг hrefшинж чанараар ашиглаж байна.
Дотоод холбоос(Вэбсайт доторх хуудасруу холбогдох) хийгдэх болон “https://www” хэсэг байхгүй хаягыг харьцангүй URL гэнэ.
<h2>Absolute URLs</h2>
<p><a href="https://apprentice.mn/">Appentice</a></p>
<p><a href="https://www.google.com/">Google</a></p>
<h2>Relative URLs</h2>
<p><a href="html_images.asp">HTML Images</a></p>
<p><a href="/css/default.asp">CSS Tutorial</a></p> HTML холбоосууд – Зургийг холбоос болгон ашигла #
Зургийг холбоос болгон ашиглахын тулд <img> тэмдэглэгээг <a> тэмдэглэгээн дотор оруулаад л болоо:
<a href="default.asp">
<img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;">
</a> Имайл хаягруу холбоос(link) үүсгэх #
Use mailto: inside the href attribute to create a link that opens the user’s email program (to let them send a new email):
href шинж чанар дотор mailto: тэмдэглэгээг ашиглаж хэрэглэгчийн имайл нээдэг программын холбоосыг үүсгэнэ( Тэднийг шинэ имайл илгээлгүүлхийн тулд)
<a href="mailto:someone@example.com">Send email</a> Холбоостой товчлуур #
HTML товчийг холбоос болгон ашиглахын тулд та зарим нэг JavaScript кодыг нэмэх хэрэгтэй.
JavaScript нь товчлуур дарах гэх мэт тодорхой үйлдүүдэд юу хийх вэ зэрэгийг хийхэд хэрэгтэй.
<button onclick="document.location='default.asp'">HTML Tutorial</button> Холбоостой гарчиг #
Гарчиг шинж чанар нь элементийн талаар нэмэлт мэдээллийг зааж өгдөг. Хулгана элементийн дээгүүр шилжих үед мэдээллийг ихэвчлэн хэрэгслийн зөвлөмж(tooltip) хэлбэрээр харуулдаг.
<a href="https://apprentice.mn/docs-category/html/" title="Go to Apprentice HTML section">Visit our HTML Tutorial</a>
Үнэмлэхүй URL ба харьцангуй URL-ийн талаар дэлгэрэнгүй үзэх #
Вэб хуудас руу холбохын тулд бүрэн URL ашиглана уу:
<a href="https://apprentice.mn/docs/html-introduction/">HTML tutorial</a> Одоогийн вэбсайт дээрх html хавтсанд байрлах хуудасны холбоос:
<a href="/html/default.asp">HTML tutorial</a>
Одоогийн хуудастай ижил фолдерт байрлах хуудасны холбоос:
<a href="default.asp">HTML tutorial</a>
Chapter Summary #
-
<a>элемент нь холбоосыг тодорхойлдог -
hrefшинж чанар нь холбоосын хаягыг тодорхойлдог -
targetшинж чанар холбоос хаана нээгдэх вэ гэдэгийг тохируулна <a>шинж чанар доторх<img>элемент ньhrefшинж чанар дотор байхmailto:систем нь хэрэглэгчийн имэйлийн програмыг нээх холбоосыг бий болгоно
