Malem mwb semua,tentunya masih dalam keadaan sehat kan? Kalau gitu saya ucapkan alhamdulillah,dipertemuan kali ini saya akan sedikit membahas trik agar gambar background pada css menjadi full satu layar.Tentunya dengan ukuran gambar yang kecil akan bisa tampil menjadi gambar yang besar.Bagi yang udah tau silahkan nyimak aja.
Triknya sangat mudah kita hanya perlu satu property yaitu "background-size:".Yaps itulah property untuk membuat gambar pada latar background menjadi layar penuh. Saya akan beri sedikit contoh:
body {background: url(http://alamat gambar kamu.com);margin:0;padding:0;background-size:100% 100%}
Maka hasilnya akan seperti klik Disini.Padahal gambar yang saya gunakan ukurannya 160x260.
Sobat bisa mengganti angka 100% menjadi berapapun semau sobat,tapi kalau ukuran satu layar penuh makan gunakan background-size:100% 100%.Property background-size bisa digunakan diberbagai element css contoh di header,content,post dll.
Memang secara kualitas gambar menjadi sangat menurun,tapi bagi saya sudah cukup lumayan bagus. Yang penting sobat tidak repot membuat gambar dengan ukuran yang sangat besar.
Untuk masalah loading juga lumayan ringan sob,jadi tak ada salahnya jika sobat berkreasi membuat sesuatu yang baru dengan css.Demikian sobat postingan saya hari ini,semoga bermanfaat untuk sobat. Jika ada kurang lebihnya saya minta maaf,dan terimakasih telah setia berkunjung keblog reot ini
Wassalamualaikum wr wb...
jos gandos gan
BalasHapusJadi Gambarnya Pecah Pecah Donk Kalo Gambar Aslinya Kecil :D
BalasHapuswww.masnhoo.blogspot.com
waduh gan,, setelah saya terapkan, backgroundnya saling tarik menarik,, padahal size background sdh ribuan,, gimana ya?
BalasHapussaya kembalikan lagi, masalahnya skrg di blog saya ini http://jomblolink.blogspot.com/ , kiri kanannya kosong / gelep.. haha
makasih sob....
BalasHapusMantap.
BalasHapusTerima kasih ilmu nya.
Semiga sukses selalu.
Https://terangbulanweb.blogspot.com
terima kasih sudah berbagi ilmunya gan.
BalasHapusshare terus ilmunya boss, biar semua bisa sama2 belajar.
BalasHapusmantap sangat membantu
BalasHapus