Bagaimana untuk menetapkan saiz imej img menggunakan css-tutorial css-php.cn

Bagaimana untuk menetapkan saiz imej img menggunakan css

WBOY

Lepaskan： 2021-11-29 15:40:35

asal

22325 orang telah melayarinya

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;}".

Bagaimana untuk menetapkan saiz imej img menggunakan css

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>

Salin selepas log masuk

Hasil keluaran:

Bagaimana untuk menetapkan saiz imej img menggunakan css

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:

Bagaimana untuk menetapkan saiz imej img menggunakan css

Apabila hanya ketinggian:150px; gaya ditambah, hasil output ialah:

Bagaimana untuk menetapkan saiz imej img menggunakan css

(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!