12 CSS3 Text Shadow Keren Untuk Blog Atau Website

Apa itu Text Shadow?, Text Shadow adalah bayangan dari sebuah tulisan Judul Blog, Judul Posting, dan lain sebagainya.

Selain font yang dirubah agar lebih menarik, memberikan bayangan pada tulisan juga bisa lebih menarik dari blog atau website.

text shadow ini cocok untuk dipasang di Judul Blog, atau pun Judul Posting agar lebih menarik. terdapat 12 text shadow yang mudah untuk dipasang di blog atau website anda. beserta tutorial cara untuk memasangnya :

• Silahkan masuk ke blogger anda.
• Setelah itu, Klik Menu Template, --> Simpan template anda terlebih dahulu, --> Klik Tombol Edit HTML.
• Kemudian, Cari kode berikut ini dan taruh CSS3 Text Shadow:

Jika Anda ingin menampilkan di judul posting cari kode berikut ini:

.post {
----------------;
----------------;
-------------;
---------------;
-----------------;
CSS3 text shadow;}

Jika Anda ingin menampilkan di judul blog cari kode berikut ini:

#header {
-------------;
-----------------;
------------------;
--------------------;
-----------------;

CSS3 text shadow;}

• 12 CSS3 text shadow untuk blog atau website :

text-shadow: 2px 4px 3px rgba(0,0,0,0.3);

body {

    background: #222;

}

#text h1 {

    color: rgba(0,0,0,0.6);

    text-shadow: 2px 2px 3px rgba(255,255,255,0.1);

}

text-shadow: 6px 6px 0px rgba(0,0,0,0.2);

text-shadow: 4px 3px 0px #fff, 9px 8px 0px rgba(0,0,0,0.15);

text-shadow: 0px 3px 0px #b2a98f,

                 0px 14px 10px rgba(0,0,0,0.15),

                 0px 24px 2px rgba(0,0,0,0.1),

                 0px 34px 30px rgba(0,0,0,0.1);

text-shadow: 0px 4px 3px rgba(0,0,0,0.4),

             0px 8px 13px rgba(0,0,0,0.1),

             0px 18px 23px rgba(0,0,0,0.1);

text-shadow: 0 1px 0 #ccc, 

               0 2px 0 #c9c9c9,

               0 3px 0 #bbb,

               0 4px 0 #b9b9b9,

               0 5px 0 #aaa,

               0 6px 1px rgba(0,0,0,.1),

               0 0 5px rgba(0,0,0,.1),

               0 1px 3px rgba(0,0,0,.3),

               0 3px 5px rgba(0,0,0,.2),

               0 5px 10px rgba(0,0,0,.25),

               0 10px 10px rgba(0,0,0,.2),

               0 20px 20px rgba(0,0,0,.15);

background-color: #666666;

    -webkit-background-clip: text;

    -moz-background-clip: text;

    background-clip: text;

    color: transparent;

    text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;

text-shadow: 0px 0px 6px rgba(255,255,255,0.7);

text-shadow: -10px 10px 0px #00e6e6,

                 -20px 20px 0px #01cccc,

                 -30px 30px 0px #00bdbd;

text-shadow: 0px 15px 5px rgba(0,0,0,0.1),

                 10px 20px 5px rgba(0,0,0,0.05),

                 -10px 20px 5px rgba(0,0,0,0.05);

color: rgba(0,0,0,0.6);

text-shadow: 2px 8px 6px rgba(0,0,0,0.2),

                 0px -5px 35px rgba(255,255,255,0.3);

• Setelah itu, Klik Tombol Simpan Template.

Selamat Mencoba,

Salam Sukses,

Your-BelajarBLOG