Mengapa Textarea Mempunyai Ruang Tambahan Di Bawahnya dalam Pelayar?

Menghapuskan Ruang Tambahan di bawah Textarea dalam Pelayar

Apabila menggunakan elemen HTML textarea, ruang tambahan yang tidak diingini mungkin muncul di bawahnya, berbeza dalam saiz daripada 1 hingga 4 piksel merentas penyemak imbas. Walaupun menggunakan markup yang mudah, isu ini berterusan.

`

<style>
    body {
        margin: 0;
        padding: 0;
    }
    .main {
        background-color: red;
    }
    textarea {
        background-color: gray;
        resize: none;
        margin: 0;
        border: 0 none;
        padding: 10px;
        height: 50px;
        overflow: hidden;
    }
</style>

<div class="main">
    <textarea></textarea>
</div>

`

Penanda ini, apabila dipaparkan dalam pelbagai penyemak imbas, mempamerkan ruang tambahan di bawah kawasan teks. Untuk menangani isu ini, adalah perlu untuk memahami bahawa sebagai elemen sebaris, textarea menyimpan ruang untuk turunan dalam teks. Walau bagaimanapun, sebab yang tepat untuk jurang yang berbeza-beza antara penyemak imbas masih tidak diketahui.

Untuk menghapuskan ruang tambahan ini dengan berkesan, tambahkan jajaran menegak: atas; ke textarea dalam CSS anda:

<code class="css">textarea {
    ...
    vertical-align: top;
    ...
}</code>

Dengan melaksanakan pengubahsuaian ini, textarea akan dijajarkan ke bahagian atas elemen induknya, dengan berkesan mengalih keluar ruang yang tidak diingini.

Atas ialah kandungan terperinci Mengapa Textarea Mempunyai Ruang Tambahan Di Bawahnya dalam Pelayar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!