Rumah > hujung hadapan web > html tutorial > Bagaimana untuk menetapkan lebar input dalam html

Bagaimana untuk menetapkan lebar input dalam html

青灯夜游
Lepaskan: 2021-11-01 16:59:25
asal
19942 orang telah melayarinya

Cara untuk menetapkan lebar input dalam HTML: 1. Tetapkan atribut lebar kepada elemen input, sintaks "" 2. Tambahkan gaya lebar pada elemen input, sintaks "input {width:width value;}".

Bagaimana untuk menetapkan lebar input dalam html

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.

Tetapkan lebar input dalam html

Kaedah 1: Gunakan atribut lebar elemen input

HTML 5 atribut lebar Atribut menentukan lebar elemen

Nota: Atribut lebar hanya digunakan pada <input type="image">.

Petua: Adalah amalan yang baik untuk menentukan atribut ketinggian dan lebar untuk imej. Jika sifat ini ditetapkan, ruang yang diperlukan akan dikhaskan untuk imej apabila halaman dimuatkan. Tanpa atribut ini, penyemak imbas tidak dapat memahami saiz imej dan tidak boleh menyimpan ruang yang sesuai untuknya. Apa yang berlaku ialah apabila halaman dan imej dimuatkan, reka letak halaman berubah.

Contoh:

<form action="demo-form.php">
  用户名: <input type="text" name="name"><br>
  密 码: <input type="password" name="pass"><br>
  <input type="image" src="img_submit.gif"  alt="Submit" width="48" height="48">
  <input type="image" src="img_submit.gif"  alt="Submit" width="100" height="100">
</form>
Salin selepas log masuk

Rendering:

Bagaimana untuk menetapkan lebar input dalam html

Kaedah 2: Gunakan gaya lebar css

atribut lebar menetapkan lebar elemen.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
#pass {
width: 200px;
}
</style>
</head>
<body>
<form action="demo-form.php">
用户名: <input type="text" name="name"><br>
密 码: <input type="password" name="pass" id="pass">
</form>
</body>
</html>
Salin selepas log masuk

Pemberian:

Bagaimana untuk menetapkan lebar input dalam html

Tutorial disyorkan: "tutorial video html"

Atas ialah kandungan terperinci Bagaimana untuk menetapkan lebar input dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan