CARA PENGGUNAAN CLASS IMAGE DI BOOTSTRAP

Bootstrap menyediakan class untuk pengaturan gambar sehingga kita dapat dengan mudah menampilkan gambar dengan bentuk rounded, circle, dan thumbnail maupun responsif mengikuti resolusi layar pengguna.

1. Class Images

Class-class untuk pengaturan gambar dalam Bootstrap sebagai berikut:

1. img-rounded

  Class untuk membuat tampilan gambar bulat atau melengkung pada keempat sedutnya.

2. rounded-circle

  Class untuk membuat tampilan gambar seperti lingkaran.

3. img-thumbnail

  Class untuk membuat tampilan gambar yang memiliki jarak pemisah seperti bingkai.

4. img-responsive

  Class untuk membuat tampilan gambar yang responsif, mengikuti lebar resolusi pengguna.

2. Penggunaan Class Images

Berikut ini contoh kode HTML untuk penggunaan class images pada Bootstrap:

Pada baris kode ke-14, gambar yang ditampilkan menggunakan class img-round pada baris ke 18, gambar menggunakan class rounded-circle. Pada baris ke-22, gambar menggunakan class img-thumbnail, dan pada baris ke-24 gambar menggunakan class img-responsive. Hasilnya seperti gambar berikut ini: