CSS Pseudo-element digunakan untuk menata bagian tertentu dari suatu elemen.
Contohnya: Menyisipkan konten dekoratif sebelum atau sesudah konten elemen menggunakan ::before dan ::after, atau menata huruf pertama suatu paragraf (Drop Cap) dengan ::first-letter.
<!DOCTYPE html>
<html>
<head>
<style>
.peringatan::before {
content: "⚠️ ";
font-size: 20px;
}
.peringatan {
background: #fffbeb;
color: #b45309;
padding: 12px;
border-radius: 6px;
border: 1px solid #fde68a;
font-weight: bold;
}
</style>
</head>
<body>
<p class="peringatan">Pemberitahuan: Harap simpan progres belajar Anda sebelum keluar!</p>
</body>
</html>Sintaks modern W3C menggunakan tanda titik dua ganda (::) untuk membedakan pseudo-element dari pseudo-class.
Properti wajib apa yang harus disertakan di dalam pseudo-element ::before atau ::after?