Penjelasan terperinci tentang sifat lebar dan ketinggian CSS-tutorial css-php.cn

Penjelasan terperinci tentang sifat lebar dan ketinggian CSS

WBOY

Lepaskan： 2022-08-02 17:44:55

asal

3940 orang telah melayarinya

Artikel ini membawa anda pengetahuan yang berkaitan tentang css, yang terutamanya memperkenalkan isu berkaitan tentang menetapkan atribut ketinggian dan lebar unsur-unsur tinggi dan lebar digunakan untuk menetapkan ketinggian dan lebar elemen. sifat ketinggian dan lebar tidak termasuk pelapik, jidar atau jidar. Mari kita lihat bersama-sama, saya harap ia akan membantu semua orang. .

Penjelasan terperinci tentang sifat lebar dan ketinggian CSS

(Belajar perkongsian video: tutorial video css, tutorial video html)

Ketinggian tetapan CSS dan lebar

Atribut ketinggian dan lebar digunakan untuk menetapkan ketinggian dan lebar elemen.
Sifat ketinggian dan lebar tidak termasuk pelapik, jidar atau jidar. Ia menetapkan ketinggian atau lebar kawasan dalam pelapik, jidar dan jidar elemen.

Nilai tinggi dan lebar CSS

height dan sifat width boleh ditetapkan kepada nilai berikut:

auto - Lalai. Pelayar mengira ketinggian dan lebar.
length - Tentukan tinggi/lebar dalam px, cm, dsb.
% - Mentakrifkan ketinggian/lebar sebagai peratusan blok yang mengandungi.
initial - Tetapkan tinggi/lebar kepada nilai lalai.
inherit - Mewarisi tinggi/lebar daripada nilai induknya.

Contohnya adalah seperti berikut:

Tetapkan ketinggian dan lebar elemen

🎜>Hasil keluaran:

<!DOCTYPE html>
<html>
<head>
<style>
div {
  height: 200px;
  width: 50%;
  background-color: powderblue;
}
</style>
</head>
<body>
<h1>设置元素的高度和宽度</h1>
<p>这个 div 元素的高度为 200 像素，宽度为 50%：</p>
<div></div>
</body>
</html>

Salin selepas log masuk

Ingat, sifat ketinggian dan lebar tidak termasuk pelapik, jidar atau jidar! Mereka menetapkan ketinggian/lebar kawasan dalam padding, sempadan dan jidar elemen! Penjelasan terperinci tentang sifat lebar dan ketinggian CSS

Tetapkan lebar maksimum

Atribut lebar maksimum digunakan untuk menetapkan lebar maksimum elemen.

Lebar maksimum (lebar maksimum) boleh ditentukan sebagai nilai panjang (cth. px, cm, dsb.) atau sebagai peratusan (%) blok yang mengandungi, atau boleh ditetapkan kepada tiada ( lalai. Maksudnya tiada lebar maksimum).

Apabila tetingkap penyemak imbas lebih kecil daripada lebar elemen (500px), masalah

sebelumnya akan berlaku. Penyemak imbas kemudiannya akan menambah bar skrol mendatar ke halaman.

Dalam kes ini, menggunakan lebar maksimum boleh meningkatkan pengendalian penyemak imbas terhadap tetingkap kecil.

Petua: Seret tetingkap penyemak imbas anda kepada kurang daripada 500px lebar untuk melihat perbezaan antara kedua-dua div!

Nota: Nilai atribut lebar maksimum akan mengatasi lebar.

Contoh adalah seperti berikut:

Hasil keluaran:

<!DOCTYPE html>
<html>
<head>
<style>
div {
  max-width: 500px;
  height: 100px;
  background-color: powderblue;
}
</style>
</head>
<body>
<h1>设置元素的最大宽度</h1>
<p>这个 div 元素的高度为 100 像素，最大宽度为 500 像素：</p>
<div></div>
<p>请调整浏览器窗口来查看效果。</p>
</body>
</html>

Salin selepas log masuk

Penjelasan terperinci tentang sifat lebar dan ketinggian CSS atribut saiz css:

(Mempelajari perkongsian video: Penjelasan terperinci tentang sifat lebar dan ketinggian CSS tutorial video css

tutorial video html)

Atas ialah kandungan terperinci Penjelasan terperinci tentang sifat lebar dan ketinggian CSS. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!