Cara membuat elemen HTML seperti pre dan textarea menghilangkan scroll bar, membungkus secara otomatis, dan menyesuaikan tinggi konten teks

Pra dan area teks dalam HTML dapat menampilkan teks yang telah diformat sebelumnya. yaitu melestarikan spasi dan baris baru. Daripada harus menambahkan elemen HTML seperti <br> dan &nbsp; untuk menambahkan jeda baris dan spasi cetak.

Saat pra menampilkan konten teks, itu tidak akan dibungkus secara otomatis. Anda dapat menambahkan beberapa CSS untuk mengatasi masalah ini:

 <pre>js kami ini sangat sangat sangat sangat sangat sangat sangat sangat sangat sangat sangat logn isinya.</pre>pre { word-wrap: break-word; white-space: pre-wrap: 9.5px ; warna latar belakang: #f5f5f5; batas: 1 piksel padat #ccc;}

Textarea membuat ketinggian adaptif terhadap tinggi konten

Textarea juga dapat mempertahankan format konten seperti sebelumnya, tetapi tinggi elemen tetap dan tidak dapat disesuaikan dengan CSS. Saat ini, Anda dapat menggunakan atribut scrollHeight.

 var textarea = document.getElementsByTagName('textarea')[0];textarea.setAttribute('style','height:'+(textarea.scrollHeight + 12)+'px');

Padding 12px ditambahkan di sini.

Di atas adalah apa yang editor perkenalkan kepada Anda cara membuat elemen HTML seperti pra dan area teks menghapus bilah gulir, secara otomatis membungkus konten teks dan menyesuaikan dengan tinggi teks. Saya harap ini dapat membantu Anda Jika ada pertanyaan, silakan tinggalkan pesan kepada saya dan editor akan segera membalas semua orang. Saya juga ingin mengucapkan terima kasih kepada semua orang atas dukungan Anda terhadap situs seni bela diri VeVb!

Jika menurut Anda artikel ini bermanfaat bagi Anda, silakan cetak ulang, harap sebutkan sumbernya, terima kasih!