BOOTSTRAP GAMBAR
Assalamu'alaikum Wr. Wb
Hai sobat semua, terima kasih sudah mengunjungi blog saya. Sebelumnya kita sudah belajar mengenai pembuatan tabel menggunakan bootstrap, nah untuk kesempatan kali ini kita akan lanjut ke materi selanjutnya yaitu tentang Gambar pada Bootstrap.
Langsung saja yuk...
ROUNDED CORNERS
Kelas .img-rounded menambahkan sudut dibulatkan ke gambar.
Contoh :
Hasilnya :
LINGKARAN
Kelas .img-circle membentuk gambar menjadi lingkaran.
Contoh :
Hasilnya :
THUMBNAIL
Kelas .img-thumbnail membentuk gambar menjadi thumbnail.
Contoh :
Hasilnya :
GAMBAR RESPONSIF
Kelas .img-responsive membuat gambar menjadi responsif.
Contoh :
Hasilnya :
GALERI GAMBARContoh :
Hasilnya :
SEMATAN RESPONSIF
Contoh berikut membuat video responsif dengan menambahkan kelas .embed-responsive-item ke tag <iframe> :
Hasilnya :
Silakan dicoba sendiri sobat. Apabila ada pertanyaan silakan tinggalkan jejak dikolom komentar. Terima kasih.
Dengan menggunakan Bootstrap kita bisa mengubah bentuk gambar menjadi lebih menarik dan juga responsif.
Referensi :
http://www.w3schools.com/bootstrap/bootstrap_images.asp
Wassalamu'alaikum Wr. Wb