Horizontal curve shadow

Horizontal curve shadow - cara membuat Horizontal curve shadow, Horizontal curve shadow dengan CSS 3 memiliki tampilan yang menarik dimana sistem bayangan dari objeknya kelihatan lebih bagus. Tampilan Horizontal curve shadow dengan CSS 3 menambah kesan suatu objek itu kelihatan memiliki tampilan 2D. Untuk melihat bagaimana tampilan dari Horizontal curve shadow ini silahkan kunjungi link demo dibawah, bila anda tertarik untuk memasang Horizontal curve shadow pada blog kesayangan anda silahkan simak tutorial dibawah ini , langsung saja menuju TKP.

Demo

Code CSS here..

/*****************************************
Name : Horizontal curve shadow
By : Rivai Silaban | Blog Design
Update :Senin 30, Desember 2013
site : www.rivai.org
******************************************/
.shadow-style {
position:relative;
float:left;
width:300px;
padding:1em;
margin:2em 10px 4em;
background:#fff;
box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}.shadow-style:before,
.shadow-style:after {
content:"";
position:absolute;
z-index:-2;
}
.shadow-style p {
font-size:16px;
font-weight:bold;
}
.bdcurve:before {
top:10px;
bottom:10px;
left:0;
right:50%;
box-shadow:0 0 25px -2px rgba(0,0,0,0.6);
border-radius:10px / 100px;
}
.rscurve:before {
right:0;
}
.rscurve:before {
top:0;
bottom:0;
left:10px;
right:10px;
border-radius:100px / 10px;
}
/*** Horizontal curve shadow CSS and ***/

Code HTML here..

<div class="shadow-style bdcurve rscurve">
<p>CODE TEXT, IMAGE, DLL </p>
</div>

Code diatas merupakan code CSS dan code tag HTML dari Horizontal curve shadow yang mungkin sudah anda lihat tampilannya pada halaman demonya, Buat teman teman yang masih belajar blogging sama seperti saya silahkan kunjungi halaman tata cara pemasangan Horizontal curve shadow..

http://www.rivai.org/2013/12/horizontal-curve-shadow.html

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter

Di posting oleh : Unknown Update pada : 10:23 AM