Skip to main content

CSS3 Text Shadow Generator

CSS3 Text Shadow Generator - Bagaimana harini kabarnya bro... baik-baik saja bukan? hari ini saya akan bercuap tentang TEXT CSS3 kita  hanya menggunakan 2 (dua) css3 property namun abahkadabra semua akan berubah menjadi sngat luar biasa ok teman-teman. Baik kita lanjutkan lagi ke topik sebenarnya kita hanya akan gunakan css3 text-shadow property dan css3 transition property saja. Text shadow berfungsi memberi efek bayangan pada teks dan css3 transition akan kita gunakan pada setiap link blog agar menampilkan transisi warna ketika cursor berada di atasnya maksudnya diarahkan gitu loch.

Hanya contoh saja silahkan kalian buka link di bawah ini dan lihat efek yang terjadi pada blog setelah 2 property css 3 digunakan.

Demo

Kode CSS yang digunakan:
body{text-shadow:2px 2px 2px #999;}
a:link,a{
       text-decoration:none;
       transition:color 0.7s linier;
       -o-transition:color 0.7s linier;
       -moz-transition:color 0.7s linier;
       -webkit-transition:color 0.7s linier;
       -ms-transition:color 0.7s linier;
}

Cara Menggunakan Kode:

  1. Simpan kode css di atas kode ]]></b:skin>
  2. Lihat cara menyimpan kode di menu sebelah kiri halaman blog Special Tutorials. Dalam daftar di dalamnya terdapat link untuk tutorial tentang cara menyimpan kode CSS atau kode lain dalam template/blog.
  3. Baca juga "Cara Backup" Template yang juga ada di sana!
  4. Tricks ini akan memberi hasil maksimal ketika blog yang anda gunakan menggunakan backkground warna terang.
  5. Jika blog anda menggunakan background warna gelap sebaiknya gunakan syntax yang ke-2 saja.
    a:link,a{
           text-decoration:none;
           transition:color 0.7s linier;
           -o-transition:color 0.7s linier;
           -moz-transition:color 0.7s linier;
           -webkit-transition:color 0.7s linier;
           -ms-transition:color 0.7s linier;
    }

    Kode css di atas akan memberi efek transisi perubahan warna teks link saat cursor disentuhkan.

  6. Selesai dan semoga bermanfaat bagi sampeyan semua!

Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :


Berbagi itu peduli:

You Might Also Like:

Cegah Virus Corona:

Silahkan tuliskan komentar,Physical distancing atau jaga jarak merupakan hal sederhana yang bisa kita lakukan untuk mencegah penyebaran virus corona.
Buka Komentar
Buka Komentar