Membuat Text Shadow

Sudah lama tidak memosting tentang trik karena sibuk mengurusi tugas sekolah jadi saya memosting informasi yang tidak harus memakai pikiran dan tidak untuk mencobanya hanya untuk di baca lalu di terbitkan deh di blog saya. Banyak teman-teman blogger mengirim email ke saya untuk memosting tentang trik css3 namun bukannya saya tidak mau teman melainkan saya belum bisa Bermain CSS3, maaf iya tapi untuk ke depannya saya akan belajar tentang css3 dan saya akan membagikannya kepada teman-teman semua.

Untuk postingan kali ini saya akan menjelaskan Membuat Text Shadow dengan mudah dan simple (katanya g bisa css3 qo sudah mulai membahas?) . Mungkin sebagian teman-teman semua sudah tahu tentang Text Shadow, kalau di artikan dalam bahasa Indonesia yaitu kata yang mempunyai bayangan seperti yang ada di blog ini.

Untuk Template yang saya pakai, saya menggunakan Text Shadow dan Box Shadow pada bagian komentar. nah untuk melihat Demo yang lebih jelas saya sarankan sobat melihat ke bawah ini

TEXT SHADOW CSS3 - TIMBUL

kode:

h1 {background:#FF6C17; font-size:24px; text-shadow:2px 2px 2px #A6250C; color:#FFE9C7;}

TEXT SHADOW CSS3 - TENGGELAM

kode:

h1 {background:#FF6C17; font-size:24px;text-shadow:1px 1px 1px #FF9924; color:#823210;}

TEXT SHADOW CSS3 - 3D

kode:

h1 {background:#FF6C17; font-size:24px; text-shadow:-1px -1px 1px #FF9924, 1px 1px 1px #A6250C; color:#FF6C17;}

Demo sumber : (Choen)

Nah setelah melihat demonya marik kita buat di template kita dengan menambahkan sedikit kode css3 yang terbaru ini :

1. Seperti biasa login ke blogger
2. Masuk ke Tata Letak => Edit HTML
3. disini saya akan menjelaskan bagaimana Membuat Text Shadow di link
4. sekarang cari kode yang hampir mirip seperti kode di bawah ini biasanya kode ini terletak di atas
   
   
   a:link {
   color:#4D4DFF;
   text-decoration:none;
   }
   
   
   
5. Setelah itu tambahkan kode text shadow yang sudah sobat pilih dari demo di atas ke dalam kode tersebut contoh
   
   
   a:link {
   color:#4D4DFF;
   text-decoration:none;
   text-shadow:-1px -1px 1px #ffffff, 1px 1px 1px #0000ff; /* Masing-masing kode warna bisa sobat ubah sesuai keinginan /*
   }
   
   
   
6. Setelah itu selesai deh dan sobat bisa melihat hasilnya
7. Selesai

Bagaimana Mudah bukan Membuat Text Shadow? mungkin untuk kedepannya saya akan menjelaskan tentang Trik CSS baik yang versi jadul maupun versi terbaru seperti CSS3 ini, Mungkin hanya sekian yang bisa saya sampaikan saya akhiri. dan Happy Blogging .

Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg