คีย์เวิร์ดคลาสเทียมใช้เพื่อระบุสถานะพิเศษของตัวเลือกที่จะเพิ่ม สิ่งนี้ทำให้เราควบคุมได้มากขึ้น และตอนนี้เราสามารถกำหนดเป้าหมายตัวเลือกเมื่ออยู่ในสถานะเฉพาะเช่น:เลื่อน ตรวจสอบแล้ว เยี่ยมชม ฯลฯ
ต่อไปนี้เป็นรหัสที่แสดงคลาสหลอกใน CSS -
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
a {
font-size: 18px;
font-weight: bold;
}
a:link {
color: rgb(17, 0, 255);
}
a:visited {
color: rgb(128, 0, 107);
}
a:hover {
color: rgb(255, 105, 243);
}
a:active {
color: rgb(255, 153, 0);
}
</style>
</head>
<body>
<h1>Pseudo class example</h1>
<a href="#">This is some sample link text</a>
<h2>Hover , click on the above link to see the pseudo class in action</h2>
</body>
</html> ผลลัพธ์
รหัสข้างต้นจะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อวางเมาส์เหนือลิงค์ −
เมื่อคลิกลิงก์ −
กลับไปที่หน้าเดิมอีกครั้ง สถานะลิงก์จะเปลี่ยนเป็นเข้าชมแล้ว
