Rumah > Artikel > hujung hadapan web > Bagaimana untuk menetapkan saiz imej img menggunakan css
Bagaimana untuk menetapkan saiz imej img menggunakan css
- WBOYasal
- 2021-11-29 15:40:3522321semak imbas
Dalam CSS, anda boleh menggunakan atribut lebar dan ketinggian untuk menetapkan saiz imej elemen img Atribut lebar digunakan untuk menetapkan nilai lebar elemen, dan atribut ketinggian digunakan untuk menetapkan nilai ketinggian elemen. Sintaks ialah "elemen img { lebar: nilai lebar; tinggi: nilai ketinggian;}".
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi CSS3&&HTML5, komputer Dell G3.
Cara menetapkan saiz imej img menggunakan css
Dalam css, anda boleh menggunakan atribut lebar dan ketinggian untuk menetapkan saiz imej daripada img, contoh Seperti berikut:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>123</title>
<style type="text/css">
.tupian{
width:150px;
height:150px;
}
</style>
</head>
<body>
<img src="1115.08.png" class="tupian" alt="Bagaimana untuk menetapkan saiz imej img menggunakan css" >
<p>上面是设置了大小，下面没设置大小</p>
<img src="1115.08.png" alt="Bagaimana untuk menetapkan saiz imej img menggunakan css" >
</body>
</html>Hasil keluaran:
Dalam contoh di atas, atribut lebar dan ketinggian ditetapkan pada masa yang sama . Jika anda ingin mencapai penskalaan yang sama, hanya perlu menetapkan atribut. Contohnya adalah seperti berikut:
Apabila hanya width:150px gaya ditambah, hasil output ialah:
Apabila hanya ketinggian:150px; gaya ditambah, hasil output ialah:
(Belajar perkongsian video: tutorial video css)
Atas ialah kandungan terperinci Bagaimana untuk menetapkan saiz imej img menggunakan css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!