Dalam HTML, area teks biasanya memungkinkan pengguna mengubah ukurannya dengan menyeret pojok kanan bawahnya. Namun, terkadang kita mungkin ingin menonaktifkan perilaku menyeret manual ini untuk memperbaiki ukuran bidang teks. Untuk mencapai hal ini, Anda dapat menggunakan properti pengubahan ukuran CSS.
Langkah-langkah spesifiknya adalah sebagai berikut:
Temukan elemen area teks (textarea) yang perlu dinonaktifkan dalam file HTML.
Tambahkan gaya CSS ke elemen bidang teks dan atur atribut resize menjadi none. Ini akan menonaktifkan pengguna dari menyeret untuk mengubah ukuran bidang teks.
Berikut ini contoh sederhananya:
<!DOCTYPEhtml>
<htmllang="id">
<kepala>
<meta charset="UTF-8">
<meta name="viewport" content="width=lebar perangkat, skala awal=1.0">
<title>Dokumen</title>
<gaya>
area teks {
resize: none; /* Menonaktifkan pengguna untuk menyeret dan mengubah ukuran secara manual */
}
</gaya>
</kepala>
<tubuh>
<textarea name="" id="" cols="30" row="10">Ini adalah konten area teks</textarea>
</tubuh>
</html> Dalam contoh di atas, kami menyetel gaya resize: none; untuk elemen textarea , sehingga mencegah pengguna mengubah ukurannya dengan menyeret.
Dalam contoh di atas, kami menyetel gaya resize: none; untuk elemen textarea, sehingga mencegah pengguna mengubah ukurannya dengan menyeret.
Perhatikan bahwa meskipun pendekatan ini bekerja secara efektif di sebagian besar browser modern, untuk memastikan kompatibilitas, sebaiknya lakukan pengujian secara menyeluruh sebelum penerapan sebenarnya. Selain itu, atribut resize adalah fitur CSS3 dan oleh karena itu mungkin tidak didukung di beberapa browser lama. Jika Anda perlu mendukung browser ini, Anda mungkin perlu mempertimbangkan untuk menggunakan metode lain atau memberikan opsi penurunan versi.
Demikianlah artikel tentang cara menyetel kolom teks HTML untuk melarang pengguna menyeret secara manual. Untuk informasi lebih lanjut tentang HTML yang melarang pengguna menyeret secara manual, silakan cari artikel sebelumnya di downcodes.com atau lanjutkan menelusuri artikel terkait di bawah downcodes.com lebih banyak lagi di masa mendatang!