Ini adalah materi ke dua CSS3 yang saya berikan.
Bab VIII : Belajar CSS3 Bagian 2 ( Tulisan )
Materinya cukup sedikit mengingat CSS3 hanya tambahan dari CSS sebelumnya.
Yang akan kalian pelajari di Bab VIII : Belajar CSS3 Bagian 2 ( Tulisan ) adalah :
1. Membuat efek bayangan pada tulisan dengan CSS3
2. Gunakan jenis tulisan baru dengan CSS3
Tahap Sebelumnya | Bab VII : Belajar CSS3 Bagian 1 ( Perkenalan | Box model | Box Shadow ) |
1. Efek Bayangan pada tulisan ( Text Shadow )
Sebelumnya saya pernah menjelaskan tentan membuat bayangan pada objek ( box | border ) sekarang efek ini ada pada tulisan tidak jauh berbeda dengan yang sebelumnya hanya berubah sedikit saya box-shadow untuk box dan text-shadow untuk tulisan, atau lebih jelasnya silahkan lihat rumus berikut :
#comments-block li {text-shadow: 0 0 10px #fff;}
# Keterangan :
text-shadow: 0 0 10px #fff silahkan kamu ubah sesuai keinginan
Contohnya yaitu :
# Keterangan :
text-shadow: 0 0 10px #fff silahkan kamu ubah sesuai keinginan
Contohnya yaitu :
color: white;font-size: 20px;font-family: arial;text-shadow: 0 0 10px #ff0000;
maka akan jadi seperti ini
2. Jenis Tulisan baru ( New Font )
Jika kamu harus memakai jenis tulisan yang harus ada di setiap komputer pengguna, sekarang kamu dapat memakai jenis tulisan tanpa harus khawatir tidak akan terbaca komputer karena pada CSS3 ini dapat memungkinkan itu terjadi, rumusnya yaitu :
@font-face {font-family: myFirstFont;src: url('url font format ttf'), url('url font format eot');}
#Keterangan :
url font format ttf masukan alamat fontnya dengan format ttf
Note : url font format eot kamu tambahkan agar Internet Explorer kompatibel dengan desain ini ( dalam format eot saja )
#Keterangan :
url font format ttf masukan alamat fontnya dengan format ttf
Note : url font format eot kamu tambahkan agar Internet Explorer kompatibel dengan desain ini ( dalam format eot saja )
| Bab IX : Belajar CSS3 Bagian 3 ( Transisi ) | Tahap Berikutnya
Belajar lagi dan menyimak sob
BalasHapus@tamannya-hati: oke
BalasHapustrus gan banyakin tutor cssx
BalasHapus@Adhi: dah mulai masuk sekolah nih sob jadi agak berkurang waktu buat blogging, ntar gua lanjutin kalo ada waktu luang
BalasHapussaya belum banyak tahu tentang css 3, terimakasih ya sudah berbagi wawasannya, salam ukhuwah sahabat.
BalasHapus@Bersama Dakwah Islam: sama-sama sobat
BalasHapus