Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Menghapuskan Ruang Tambahan Di Bawah Textarea dalam Pelayar Berbeza?

Bagaimana untuk Menghapuskan Ruang Tambahan Di Bawah Textarea dalam Pelayar Berbeza?

Barbara Streisand
Barbara Streisandasal
2024-11-04 20:08:02568semak imbas

How to Eliminate Extra Space Below Textareas in Different Browsers?

Ruang Tambahan Di Bawah Textarea dalam Penyemak Imbas

Dalam HTML, textarea boleh mempamerkan ruang tambahan di bahagian bawah, yang berbeza-beza ketinggian merentas penyemak imbas yang berbeza . Jurang ini timbul disebabkan sifat kawasan teks sebaris atau blok sebaris, kerana ia mewakili ruang untuk penurunan teks yang berpotensi.

Untuk mengalih keluar ruang tambahan ini, sifat CSS "vertical-align: top" harus digunakan pada elemen textarea. Sifat ini memastikan garis dasar textarea sejajar dengan bahagian atas elemen sekeliling, dengan berkesan menghapuskan jurang.

Kod HTML dan CSS yang disemak berikut menunjukkan penyelesaiannya:

<code class="html"><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;
        vertical-align: top;
    }
</style></code>

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Ruang Tambahan Di Bawah Textarea dalam Pelayar Berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn