Pseudo-class read-only

Pseudo-class read-only mengatur gaya untuk elemen input yang memiliki atribut readonly. Input seperti ini hanya ditujukan untuk dibaca, artinya tidak mungkin untuk memasukkan atau mengubah data di dalamnya, namun datanya dapat dipilih dan disalin.

Sintaks

selector:read-only {
	
}

Contoh

Mari kita atur border abu-abu pudar pada input yang hanya dapat dibaca:

<p>
	<label>Masukkan teks</label>
	<input type="text">
</p>
<p>
	<label>Baca teks</label>
	<input type="text" value="text" readonly>
</p>

input:read-only {
	border: 1px solid #D8DFE8;
}

Lihat juga

pseudo-class :read-write,
yang mengatur gaya untuk input yang dapat diubah
pseudo-class :default,
yang mengatur gaya untuk elemen default
pseudo-class :indeterminate,
yang mengatur gaya untuk elemen toggle yang berada dalam status tidak tentu
pseudo-class :optional,
yang mengatur gaya untuk input yang tidak memiliki atribut required
pseudo-class :placeholder-shown,
yang mengatur gaya untuk elemen saat teks placeholder ditampilkan
pseudo-class :required,
yang mengatur gaya untuk input yang memiliki atribut required
pseudo-class :focus-within,
yang mengatur gaya untuk elemen yang dalam fokus
properti caret-color,
yang mengatur warna kursor teks di dalam input