Berita ringan mengenai drop shadow with CSS yaitu membuat efek bayangan dengan menggunakan attribute CSS3. Mungkin sudah pada tauk kodenya apaan saja sobat-sobat :D Tapi kabar terbaru, kode drop shadow ini sudah dapat support Firefox 3.5+, Safari 3+, Google Chrome, Opera 10.50, Internet Explorer 5.5. Oke untuk lebih jelasnya silahkan sobat tour dulu yah ;))
- CSS3 box-shadow Property Try it Yourself
- CSS3 text-shadow Property Try it Yourself
.shadow {
-moz-box-shadow: 3px 3px 4px #000;
-webkit-box-shadow: 3px 3px 4px #000;
box-shadow: 3px 3px 4px #000;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
-moz-box-shadow: 3px 3px 4px #000;
-webkit-box-shadow: 3px 3px 4px #000;
box-shadow: 3px 3px 4px #000;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
Contoh Drop Shadow
Dengan menggunakan atribut kode diatas, sobat bisa menghasilkan sebuah bayangan yang yahud punya b-) Selamat berkreasi biar indah yah ;)
Loading... |
2 comments
DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...