เพิ่มเติม "ลองตัวเอง" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
<a> แท็กกำหนดเชื่อมโยงหลายมิติที่ใช้ในการเชื่อมโยงจากหน้าหนึ่งไปยังอีก
คุณลักษณะที่สำคัญที่สุดของ <a> องค์ประกอบเป็น href แอตทริบิวต์ซึ่งบ่งชี้ว่าปลายทางของลิงก์
โดยค่าเริ่มต้นการเชื่อมโยงจะปรากฏดังต่อไปนี้ในเบราว์เซอร์ทั้งหมด:
- การเชื่อมโยง unvisited และขีดเส้นใต้สีฟ้า
- การเชื่อมโยงเข้าเยี่ยมชมและขีดเส้นใต้สีม่วง
- ลิงค์ที่ใช้งานและขีดเส้นใต้สีแดง
สนับสนุนเบราว์เซอร์
ธาตุ | |||||
---|---|---|---|---|---|
<a> | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
เคล็ดลับและคำอธิบาย
เคล็ดลับการ following คุณลักษณะ: download, hreflang, media, rel, target และ type ไม่สามารถที่จะนำเสนอถ้า href แอตทริบิวต์ไม่อยู่
เคล็ดลับ: หน้าเชื่อมโยงจะปรากฏตามปกติในหน้าต่างเบราว์เซอร์ในปัจจุบันเว้นแต่คุณจะระบุเป้าหมายอื่น
เคล็ดลับ: ใช้ CSS เพื่อเชื่อมโยงสไตล์: CSS ลิงค์สอน และ ปุ่ม CSS สอน
ความแตกต่างระหว่าง HTML 4.01 และ HTML5
ใน HTML 4.01 ที่ <a> แท็กสามารถเป็นได้ทั้งเชื่อมโยงหลายมิติหรือสมอ ใน HTML5 ที่ <a> แท็กอยู่เสมอเชื่อมโยงหลายมิติ แต่ถ้ามันไม่มี href แอตทริบิวต์มันก็เป็นเพียงตัวยึดสำหรับเชื่อมโยงหลายมิติที่
HTML5 มีคุณลักษณะใหม่บางส่วนและบางส่วนแอตทริบิวต์ HTML 4.01 ได้รับการสนับสนุนอีกต่อไป
แอตทริบิวต์
= ใหม่ใน HTML5
แอตทริบิวต์ทั่วโลก
<a> แท็กยังสนับสนุน แอตทริบิวต์ใน HTML
แอตทริบิวต์เหตุการณ์
<a> แท็กยังสนับสนุน คุณสมบัติเหตุการณ์ใน HTML
ลองตัวเอง - ตัวอย่าง
สร้างเชื่อมโยงหลายมิติ
วิธีการสร้างเชื่อมโยงหลายมิติ
ภาพเป็นลิงค์
วิธีการใช้ภาพเป็นลิงก์
เปิดลิงก์ในหน้าต่างเบราว์เซอร์ใหม่
วิธีการเปิดลิงก์ในหน้าต่างเบราว์เซอร์ใหม่เพื่อให้ผู้เข้าชมไม่ต้องออกจากเว็บไซต์ของคุณ
สร้างการเชื่อมโยง mailto
วิธีการเชื่อมโยงไปยังข้อความอีเมล (จะทำงานหากคุณมีจดหมายติดตั้ง)
สร้างการเชื่อมโยง mailto 2
อีกประการหนึ่งการเชื่อมโยง mailto
เชื่อมโยงไปยังองค์ประกอบกับที่ระบุ id
วิธีการเชื่อมโยงไปยังองค์ประกอบกับที่ระบุ id ภายในหน้า (คน name แอตทริบิวต์ไม่สนับสนุนใน HTML5)
เชื่อมโยงไปยัง JavaScript
วิธีการเพิ่ม JavaScript ภายใน href แอตทริบิวต์
หน้าเว็บที่เกี่ยวข้อง
กวดวิชา HTML: ลิงก์ HTML
อ้างอิง HTML DOM: Anchor วัตถุ
CSS Tutorial: ลิงค์จัดแต่งทรงผม
ตั้งค่าเริ่มต้น CSS
เบราว์เซอร์ส่วนใหญ่จะแสดง <a> องค์ประกอบที่มีค่าเริ่มต้นต่อไปนี้:
a:link, a:visited {
color: ( internal value );
text-decoration: underline;
cursor: auto;
}
a:link:active, a:visited:active {
color: ( internal value );
}
คุณลักษณะ | ความคุ้มค่า | ลักษณะ |
---|---|---|
charset | char_encoding | ได้รับการสนับสนุนใน HTML5 ระบุตัวตั้งของเอกสารที่เชื่อมโยง |
coords | coordinates | ได้รับการสนับสนุนใน HTML5 ระบุพิกัดของลิงค์ |
download | filename | ระบุว่าเป้าหมายจะถูกดาวน์โหลดเมื่อผู้ใช้คลิกที่เชื่อมโยงหลายมิติ |
href | URL | ระบุ URL ของหน้าการเชื่อมโยงไปที่ |
hreflang | language_code | ระบุภาษาของเอกสารที่เชื่อมโยง |
media | media_query | ระบุสิ่งที่สื่อ / อุปกรณ์เอกสารที่เชื่อมโยงเป็นที่เหมาะสำหรับ |
name | section_name | ได้รับการสนับสนุนใน HTML5 ใช้ทั่วโลก id แอตทริบิวต์ แทน ระบุชื่อของสมอ |
rel | alternate author bookmark help license next nofollow noreferrer prefetch prev search tag | ระบุความสัมพันธ์ระหว่างเอกสารปัจจุบันและเอกสารที่เชื่อมโยง |
rev | text | ได้รับการสนับสนุนใน HTML5 ระบุความสัมพันธ์ระหว่างเอกสารเชื่อมโยงและเอกสารปัจจุบัน |
shape | default rect circle poly | ได้รับการสนับสนุนใน HTML5 ระบุรูปร่างของลิงค์ |
target | _blank _parent _self _top framename | ระบุตำแหน่งที่จะเปิดเอกสารที่เชื่อมโยง |
type | media_type | ระบุชนิดของสื่อของเอกสารที่เชื่อมโยง |