Karena keadaan berubah secara dinamis, ketika sebuah elemen mencapai keadaan tertentu, ia mungkin mendapatkan gaya kelas semu; ketika keadaan berubah, ia akan kehilangan gaya ini. Terlihat dari fungsinya agak mirip dengan kelas, namun didasarkan pada abstraksi di luar dokumen, sehingga disebut kelas semu.
Pseudo-class CSS adalah kelas khusus yang bekerja pada selector CSS untuk menghasilkan efek tertentu pada tag atau elemen yang dipilih.
Sintaks kelas semu CSS adalah: pemilih: nama kelas semu {atribut: nilai atribut}
Kelas semu yang paling umum digunakan adalah kelas semu hyperlink a. Tautan adalah bagian penting dari sebuah situs web. Anda dapat melihat banyak tautan di hampir setiap halaman web. Desain gaya tautan yang masuk akal dapat menambah tampilan halaman web .titik. Tautan memiliki empat status berbeda, yaitu tautan, dikunjungi, aktif, dan arahkan kursor. Anda dapat mengatur gaya berbeda untuk empat status tautan melalui penyeleksi kelas semu berikut:
:link: Menentukan gaya tautan yang belum dikunjungi;
:visited: Mendefinisikan gaya tautan yang dikunjungi;
:hover: Menentukan gaya ketika mouse melewati atau mengarahkan kursor ke tautan;
:aktif: Menentukan gaya saat tautan diklik.
Contoh:
<html><head></head><body><a>Tidak ada tag href a, font tidak diubah, dan tidak ada respons saat mouse diletakkan di atasnya</a></br>< ahref=#target=_blank>href adalah Tag a # secara default berwarna biru dan bergaris bawah. Saat Anda mengarahkan mouse ke atasnya, tag tersebut berubah menjadi tangan</a></br><ahref=https://www .dotcpp.com/target=_blank>href adalah tag URL. Efeknya sama seperti di atas</a></body></html>
Hasil berjalan:
(1): tautan
Deskripsi: Mengatur properti style sheet suatu objek sebelum diakses.
Contoh:
<!DOCTYPEhtml><html><head><style>a{text-decoration:none;}a:link{font-size:18px;border:1pxsolidblack;padding:5px;margin-left:10px;background:#ccc ;color:black;}</style></head><body><ahref=''>Tautan pertama</a><ahref=''>Tautan kedua</a></body>< /html>
Hasil berjalan:
(2): dikunjungi
Deskripsi: Mengatur atribut style sheet suatu objek yang kedaluwarsa ketika alamat tautannya telah diakses.
Contoh:
<!DOCTYPEhtml><html><head><style>a{text-decoration:none;}a:link{font-size:18px;border:1pxsolidblack;padding:5px;margin-left:10px;background:#ccc ;color:black;}a:visited{background:#FFFF99;border:1pxsoildred;color:red;}</style></head><body><ahref=''>Tautan pertama</a>< ahref= ''>Tautan kedua</a></body></html>
Hasil berjalan:
(3): arahkan kursor
Deskripsi: Menyetel properti lembar gaya suatu objek saat diarahkan dengan mouse.
Contoh:
<!DOCTYPEhtml><html><head><style>a{text-decoration:none;}a:link{font-size:18px;border:1pxsolidblack;padding:5px;margin-left:10px;background:#ccc ;color:black;}a:mengunjungi{background:#FFFF99;border:1pxsolidred;color:red;}a:hover{background:#9c6ae1;border:1pxsolidblack;color:black;</style></head> <body><ahref=''>Tautan pertama</a><ahref=''>Tautan kedua</a></body></html>
Hasil berjalan:
(4): aktif
Deskripsi: Mengatur properti style sheet suatu objek ketika diaktifkan oleh pengguna (peristiwa yang terjadi antara klik mouse dan pelepasan).
Contoh:
<!DOCTYPEhtml><html><head><style>a{text-decoration:none;}a:link{font-size:18px;border:1pxsolidblack;padding:5px;margin-left:10px;background:#ccc ;warna:hitam;}a:mengunjungi{latar belakang:#FFFF99;border:1pxsolidred;color:merah;}a:hover{background:#9c6ae1;border:1pxsolidblack;color:black;}a:aktif{background:#000 ;border:1pxsolidblack;color:white;}</style></head><body><ahref=''>Tautan pertama</a><ahref=''>Tautan kedua</a>< /body>< /html>
Hasil berjalan:
Urutan yang berbeda saat mendefinisikan CSS akan secara langsung menyebabkan efek tampilan tautan yang berbeda. Alasannya mungkin karena "prinsip kedekatan" yang diikuti browser saat menafsirkan CSS. Urutan yang benar: a:link, a:visited, a:hover, a:active.