คลิกแล้วเปลี่ยนสี CSS ลิงก์ ด้วย focus และ visited

คลิกแล้วเปลี่ยนสี CSS ลิงก์ ด้วย focus และ visited บทความนี้สอนการใช้คำสั่ง :focus และ :visited กับไฮเปอร์ลิงก์ หรือแท็ก a ของ HTML สำหรับเปลี่ยนสีลิงก์ที่ถูกคลิก และถูกคลิกไปแล้ว สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง คลิกแล้วเปลี่ยนสี CSS ลิงก์ ด้วย focus และ visited

<style>
    .contact:visited {
        color: green;
    }    
    .contact:focus {
        color: red;
    }
</style>

<a href="contact.php" class="contact">หน้าติดต่อเรา</a>

คลิกแล้วเปลี่ยนสี CSS ลิงก์ ด้วย focus และ visited ความแตกต่างระหว่าง 2 คำสั่งนี้คือ 

1. visited คือ ลิงก์ที่เคยถูกคลิกไปแล้ว หากต้องการเปลี่ยนสีลิงก์ที่เคยถูกคลิกไปแล้ว ให้ใช้ visited

2. focus คือ ลิงก์ที่กำลังถูกคลิกอยู่ ณ ปัจจุบัน หากต้องการเปลี่ยนสีลิงก์ที่กำลังถูกคลิก ให้ใช้ focus