Membuat background efek kertas bertumpuk menggunakan css
Kali ini saya akan mencoba share cara membuat background efek kertas bertumpuk menggunakan css. Mungkin diantara sobat merasa ini hanyalah trik jadul, karena memanfaatkan CSS2 dan CSS3.
Namun mungkin ada juga yang belum tahu, atau malah baru melihatnya? Nah, bagi yang belum tahu, bagaimanakan contoh background efek bertumpuk?
Inilah gambarannya.
Bagaimana? kerenkan kalau di pasang di blog kita.
Mungkin sobat juga mau membaca Cara membuat sudut melengkung / rounded corner dengan css
Ini kode Css yang digunakan untuk membuat background efek bertumpuk
#content {Teks yang berwarna biru silahkan di ubah menjadi nama selector yang akan kita beri efek background bertumpuk.
background : #d6d5d5;
width : 90%;
margin : 0px auto 40px;
position : relative;
padding-top : 20px;
}#content:before,#content:after {
content : "";
position : absolute;
top : 6px;
left : 6px;
width : 100%;
height : 100%;
background : #989898;
z-index : -1
}#content:before {
top : 12px;
left : 12px;
background : #6c6666
}
Valuenya juga bisa disesuaikan sendiri.
Ternyata sangat mudah sekali kan sobat?
Silahkan dikreasikan lagi agar lebih menarik.
keren juga kalau blog saya dikasih efek background kertas bertumpuk, itu editnya dibagian mana ya mas apa dibagian template ?
BalasHapusIya gan. Tambahkan di bagian css. Jangan lupa ubah selectornya.
Hapusnice tutorial gan, bookmark dulu deh ntr psti suatu saat ane butuh nih
BalasHapus