Rumah > hujung hadapan web > tutorial css > Bagaimana untuk menetapkan lebar elemen dalam css

Bagaimana untuk menetapkan lebar elemen dalam css

青灯夜游
Lepaskan: 2023-01-11 09:19:56
asal
8932 orang telah melayarinya

Kaedah tetapan: 1. Gunakan atribut width untuk menetapkan lebar, sintaks "width: width value;"; 2. Gunakan atribut min-width untuk menetapkan lebar minimum, sintaks "min-width : width value;"; 3. Gunakan atribut max-width untuk menetapkan lebar maksimum, sintaks "max-width: width value;".

Bagaimana untuk menetapkan lebar elemen dalam css

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

lebar elemen set css

1. Gunakan atribut lebar

atribut lebar untuk ditetapkan lebar elemen. Atribut ini mentakrifkan lebar kawasan kandungan elemen dan pelapik, sempadan dan jidar boleh ditambah di luar kawasan kandungan.

<html>
<head>
<style type="text/css">
img
{
width: 300px
}
</style>
</head>
<body>

<img  src="eg_smile.gif" / alt="Bagaimana untuk menetapkan lebar elemen dalam css" >

</body>
</html>
Salin selepas log masuk

Perenderan:

Bagaimana untuk menetapkan lebar elemen dalam css

2 Gunakan atribut lebar min

min Atribut -width menetapkan lebar minimum elemen. Nilai atribut ini menetapkan had minimum pada lebar elemen. Oleh itu, elemen boleh lebih luas daripada nilai yang ditentukan, tetapi tidak lebih sempit. Nilai negatif tidak dibenarkan.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style type="text/css">
    	.min{
    		min-width: 300px;
    	}
    </style>
  </head>
  <body>
  	<textarea>文本框默认宽度</textarea><br>
    <textarea class="min">文本框最小宽度300px</textarea>
  </body>
</html>
Salin selepas log masuk

Perenderan:

Bagaimana untuk menetapkan lebar elemen dalam css

3 Gunakan atribut lebar maksimum

atribut ketinggian maksimum. Tetapkan ketinggian maksimum elemen. Nilai atribut ini menetapkan had maksimum pada ketinggian elemen. Oleh itu, elemen boleh menjadi lebih pendek daripada nilai yang ditentukan, tetapi tidak lebih tinggi. Nilai negatif tidak dibenarkan.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
  	<textarea>文本框默认宽度</textarea><br>
    <textarea style="max-width: 400px;">文本框最大宽度400px</textarea>
  </body>
</html>
Salin selepas log masuk

Rendering:

Bagaimana untuk menetapkan lebar elemen dalam css

(Belajar perkongsian video: tutorial video css)

Atas ialah kandungan terperinci Bagaimana untuk menetapkan lebar elemen dalam css. 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