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

Bagaimana untuk menetapkan lebar elemen dalam css

青灯夜游
青灯夜游asal
2021-09-13 17:28:328894semak imbas

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>

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>

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>

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!

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