Cara mengodkan kotak teks bar skrol HTML

Tajuk: Cara menulis kod kotak teks HTML dengan bar skrol

Kotak teks dalam HTML ialah salah satu kawalan input pengguna yang biasa digunakan Dalam sesetengah kes, apabila kandungan teks terlalu panjang, kotak teks akan menjadi dipaparkan tidak lengkap. Pada masa ini, kita boleh menambah bar skrol pada kotak teks untuk menyokong penatalan. Artikel ini akan memperkenalkan secara terperinci cara menulis kod kotak teks HTML dengan kesan bar skrol, dan memberikan contoh kod khusus.

1. Gunakan elemen textarea untuk mencipta kotak teks

Dalam HTML, kami menggunakan elemen textarea untuk mencipta kotak teks. Elemen textarea mempunyai atribut baris dan kol, yang menentukan bilangan baris dan lajur kotak teks. Walau bagaimanapun, kesan bar skrol tidak boleh dicapai hanya menggunakan dua sifat ini. Kami juga perlu menggunakan gaya CSS untuk mencapai kesan bar skrol. Berikut ialah contoh kod kotak teks asas:

<textarea rows="5" cols="30" style="overflow:auto"></textarea>

Dalam kod di atas, kami menyediakan kotak teks dengan 5 baris dan 30 lajur dan menambah limpahan:gaya auto melalui atribut gaya. Gaya ini boleh memaparkan bar skrol secara automatik dan hanya memaparkan bar skrol apabila kandungan teks terlalu panjang.

2. Tetapkan lebar dan tinggi kotak teks

Selain menetapkan bilangan baris dan lajur kotak teks, kami juga boleh menetapkan lebar dan tinggi kotak teks melalui gaya CSS. Berikut ialah contoh kod kotak teks dengan lebar dan ketinggian tersuai:

<textarea rows="5" cols="30" style="width:300px; height:100px; overflow:auto"></textarea>

Dalam kod di atas, kami menetapkan lebar dan tinggi kotak teks kepada 300px melalui gaya lebar dan ketinggian atribut gaya.

3. Tetapkan kandungan teks lalai dalam kotak teks

Kadangkala, kami mahu memaparkan beberapa kandungan teks lalai dalam kotak teks untuk menggesa pengguna memasukkan. Kefungsian ini boleh dicapai menggunakan atribut pemegang tempat. Berikut ialah contoh kod kotak teks dengan kandungan teks lalai:

<textarea rows="5" cols="30" style="overflow:auto" placeholder="请输入文本内容"></textarea>

Dalam kod di atas, kami menetapkan kandungan teks lalai kepada "Sila masukkan kandungan teks" melalui atribut pemegang tempat.

Ringkasnya, kita boleh menggunakan elemen textarea dan gaya CSS untuk mencipta kotak teks HTML dengan bar skrol. Dengan melaraskan atribut seperti baris, kol, lebar dan ketinggian, kotak teks dengan saiz dan gaya yang berbeza juga boleh direalisasikan. Saya harap kandungan di atas dapat membantu anda memahami dan menggunakan kod kotak teks bar skrol HTML.

Atas ialah kandungan terperinci Cara mengodkan kotak teks bar skrol HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!