Kemajuan besar telah banyak dicapai pada kode css. Background size property adalah salah satu diantaranya. Sebuah property yang membuat designer blog atau blogger lebih mudah dalam mengaplikasikan image sebagai sebuah background image karena dengan properti baru ini ukuran image menjadi lebih fleksibel. Anda dapat merubah ukuran sebuah background image sesuka hati hanya dengan menambahkan value/nilai yang sesuai dengan ukuran yang diharapkan pada background-size property. Jika sebelumnya kita dipusingkan untuk menggunakan software pembuat gambar/image editing dengan sebaik mungkin agar mendapatkan ukuran background setepat mungkin, kini hal ini bisa sedikit diabaikan karena kesalahan ukuran background image yang tak terlalu fatal dapat kita koreksi melalui background size property.
dengan value width dan height dalam nilai pixel(px), em atau %(persen). Nilai yang paling sering digunakan adalah pixel (px).
Penulisan kode background-size property
background-size:value-width value-height;dengan value width dan height dalam nilai pixel(px), em atau %(persen). Nilai yang paling sering digunakan adalah pixel (px).
penerapan background-size property dalam sebuah elemen atau syntax.
div{
width:400px;
height:200px;
margin:20px auto;
border:4px solid green;
padding:4px;
background-image:url();
background-position:top center;
background-repeat:no-repeat;
background-size:400px 200px;
}Keterangan/informasi:
Pada demo yang pertama (background size property-1)background size dapat anda ganti dengan nilai/value seperti di bawah ini :
- background-size:25em 12.5em;
- background-size:96% 93%;
Dalam box dibawah ini telah disediakan kode lengkap untuk demo tentang background attachment property. Edit kode untuk mendapatkan hasil berbeda!
Please click the button to display. Continue with editing code and click to see the results!
Post : Background Size Propertyby : gubhugreyot - gubhugcss
my Blogs : Demo Tutorial Blogger-1 | Demo Tutorial Blogger-2 | Best Blogger Hacks | Best Blogger Menus | gubhuggreyot-b'detik | gubhugreyot
Tidak ada komentar:
Posting Komentar