ลิงค์ HTML - สีต่างๆ
ลิงค์ HTML จะแสดงเป็นสีที่แตกต่างกันขึ้นอยู่กับว่ามีการเยี่ยมชม ไม่ได้เยี่ยมชม หรือเปิดใช้งานอยู่
HTML ลิงค์สี
ตามค่าเริ่มต้น ลิงก์จะปรากฏดังนี้ (ในทุกเบราว์เซอร์):
- ลิงก์ที่ยังไม่ได้เข้าชมจะถูกขีดเส้นใต้และสีน้ำเงิน
- ลิงก์ที่เข้าชมถูกขีดเส้นใต้และสีม่วง
- ลิงก์ที่ใช้งานอยู่จะถูกขีดเส้นใต้และสีแดง
คุณสามารถเปลี่ยนสีของสถานะลิงก์ได้โดยใช้ CSS:
ตัวอย่าง
ที่นี่ ลิงก์ที่ยังไม่ได้เข้าชมจะเป็นสีเขียวโดยไม่มีการขีดเส้นใต้ ลิงค์ที่เข้าชมจะเป็นสีชมพูโดยไม่มีขีดเส้นใต้ ลิงก์ที่ใช้งานจะเป็นสีเหลืองและขีดเส้นใต้ นอกจากนี้ เมื่อวางเมาส์เหนือลิงก์ (a:hover) จะกลายเป็นสีแดงและขีดเส้นใต้:
<style>
a:link {
color: green;
background-color: transparent;
text-decoration: none;
}
a:visited {
color: pink;
background-color: transparent;
text-decoration: none;
}
a:hover {
color: red;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: yellow;
background-color: transparent;
text-decoration: underline;
}
</style>
ปุ่มลิงค์
ลิงก์สามารถกำหนดสไตล์เป็นปุ่มได้โดยใช้ CSS:
นี่คือลิงค์ตัวอย่าง
<style>
a:link, a:visited {
background-color: #f44336;
color: white;
padding: 15px 25px;
text-align: center;
text-decoration: none;
display: inline-block;
}
a:hover, a:active {
background-color: red;
}
</style>
หากต้องการเรียนรู้เพิ่มเติมเกี่ยวกับ CSS ไปที่CSS Tutorialของ เรา
แท็กลิงก์ HTML
| Tag | Description |
|---|---|
| <a> | Defines a hyperlink |
สำหรับรายการแท็ก HTML ทั้งหมดที่มีอยู่ โปรดไปที่การอ้างอิงแท็ก HTMLของ เรา