Breaking

Thursday, October 5, 2017

Tutorial Bootstrap Part 5 : Menampilkan Gambar Dengan Bootstrap

Assalamu'alaikum W. W

Abdul Hafid Gunawan - Hai sobat setia SC Blog, kali ini saya akan membagikan / sharing tentang Menampilkan Gambar dengan Bootstrap.

PENGERTIAN
Penampilan Gambar yang responsive, berbentuk unik untuk mencocokkan bentuk gambar dengan template website yang teman" buat.


CLASS MENGATUR GAMBAR DI BOOTSTRAP & KEGUNAANNYA
  1. rounded = Membuat gambar tepi gambar menjadi tumpul / istilahnya menggunakan border-radius.
  2. .img-thumbnail = Membuat gambar menjadi thumbnail.
Berikut ini akan saya buatkan contoh pemakaian dari setiap class untuk mengatur gambar di bootstrap :

1. MENGATUR GAMBAR MENGGUNAKAN .img-thumbnail
Untuk scriptnya bisa lihat di gambar & hasil dari script tersebut.


Untuk menggunakan class thumbnail, sobat bisa tambahkan atribut class="img-thumbnail".

2. MENGATUR GAMBAR MENGGUNAKAN .rounded


KESIMPULAN
Nah, pada Bootstrap 4 ini kita bisa menggunakan kedua class tersebut yaitu .img-thumbnail & rounded. Namun, di Bootstrap 4 sudah menghilangkan class .img-responsive, .img-circle, sekarang bootstrap 4 hanya memakai dua class yang di sediakan di Bootstrap 4.

No comments:

Post a Comment