CSS ตอน Link states

โดยปกติ จุดลิงก์ที่เป็นตัวอักษรที่กำหนดด้วยแท็ก a นั้นถ้าเราไม่ได้มีการใช้ CSS ในการควบคุม ก็จะแสดงผลตามที่ browser กำหนดไว้ ซึ่งโดยปกติก็คือ ตัวอักษรสีน้ำเงินขีดเส้นใต้

ลิงก์จะมีสถานะที่จะปรากฏการแสดงผลอยู่ 4 สถานะ ได้แก่
1. link คือ รูปแบบปกติ ที่บอกให้รู้ว่านี่คือ ลิงก์
2. visited คือ รูปแบบของลิงก์ที่ browser จำได้ว่าเคยคลิกเข้าไปแล้ว
3. hover คือ รูปแบบในขณะที่เราเอา เมาส์เคอร์เซอร์ไปวางที่จุดลิงก์
4. active คือ รูปแบบที่อยู่ในสถานะขณะที่คลิกลิงก์

ตัวอย่าง

a:link, a:visited {
color:#999999;
}
a:hover, a:active {
color:#FF3333;
}

จากตัวอย่างจะเป็นการกำหนดสถานะของจุดลิงก์ โดยสถานะ link และ visited จะกำหนดให้มีลักษณะเดียวกัน คือ เป็นตัวอักษรสีเทา ส่วน สถานะ hover และ active มีลักษณะเดียวกันคือ ตัวอักษรสีแดง