Minggu, 20 November 2011

Membuat Gambar Bershadow Dengan CSS3

Membuat Gambar Bershadow Dengan CSS3

Tutorial Blogger kali ini saya akan memberikan Cara Membuat Gambar Bershadow Dengan CSS3,banyak keunggulan CSS 3 dibandingkan generasi yang sebelumnya, dan sudah mulai digunakan browser-browser, yaitu diantaranya adalah Mozilla Firefox v 3.6 dan Safari V 3, semoga saja browser-browser lainya menyusul untuk mendukung CSS 3.
Gambar tersebut nantinya akan terlihat seperti gambar di atas. Nah bagaimana caranya? silahkan ikuti langkah-langkah dibawah in:1. Login di Blogger.com / draft.blogger.com
2. Silahkan Masuk di Rancangan / Tata Letak lalu lanjutkan ke Tab Edit HTML
3. Cari kode seperti ini
.post img {
- - -
- - -
}

Note :

1. Perhatikan saja code yang berwarna merah diatas, karena garis ( - - - ) yang berwarna hijau adalah definisi CSS yang berbeda-beda setiap template
2. Dan kadang code yang berwarna merah ada tambahanya sehingga seperti ini : .post img, table.tr-caption-container {

4. Kalau sudah ketemu gantilah kode yang merah tadi,Sehingga kode yang merah tadi menjadi seperti ini
.post img {
background:#FFFFFF;
border:1px solid $bordercolor;
padding: 7px;
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
-goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);
}

5. Dan yang terakhir silahkan disimpan/di SAVE
Semoga Tutorial Blogger Cara Membuat Gambar Bershadow Dengan CSS3 kali ini bisa bermanfaat bagi kita semua.

0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Design Blog, Make Online Money