DATABASE.co.id

Cara membuat gambar responsive dengan HTML dan CSS

Dibawah ini saya akan mengajarkan cara membuat gambar atau foto dalam html menjadi responsive dengan cara yang sederhana dan mudah dimengerti. Gambar responsive akan menyesuaikan lebar dan tingginya secara otomatis dengan ukuran layar.

Tahap Pertama Tambahkan HTML:

Contoh:

<img src="nature.jpg" alt="Nature" class="responsive">

Langkah 2. Tambahkan CSS:

Jika Anda ingin gambar mengubah skala baik menjadi lebih besar maupun lebih kecil saat responsif, atur properti lebar CSS menjadi 100% dan tinggi menjadi otomatis:

Contoh:
.responsif { width: 100%; height: auto; }

Jika Anda ingin gambar mengubah skala menjadi lebih kecil jika diperlukan, tetapi tidak pernah membesar hingga lebih besar dari ukuran aslinya, gunakan max-width: 100%:

Contoh:
.responsif { max-width: 100%; height: auto; }

Hasilnya:

Contoh Software ERP custom


Artikel Terkait

  1. Kelebihan Software ERP Custom Dibanding Software ERP yang Sudah Jadi
  2. Kontak Database
  3. perusahaan database di indonesia

Product Terkait

  1. Kasir Salon dan SPA Kabupaten rejang lebong
  2. Software Pergudangan Kabupaten sidoarjo
  3. Kasir Cafe dan RestoranKabupaten asahan
  4. ERP Untuk Pabrik Kota bau bau
  5. Kasir Klinik KecantikanKabupaten konawe selatan
  6. Database Solutions Kabupaten manokwari