Memperindah blog bisa dilakukan dengan berbagai cara, salah satunya adalah dengan mendekorasi huruf menggunakan CSS (Cascading Style Sheet). Berikut merupakan berbagai contoh dekorasi yang mungkin bisa menginspirasi temen2 semua. Silakapan copas ( copy-paste ) CSS Property tersebut ke dalam tag yang ada di file CSS.Style di WordPress.
Pastikan dan pasteu-kan kode tersebut berada dalam tanda { dan }. Sebagai contoh misalnya seperti berikut :
atau
Contoh diatas hanyalah beberapa dekorasi yang bisa dilakukan dengan
mengubah properti dari CSS. Tentunya masih banyak lagi dekorasi dan
variasi yang lain dengan cara mengekplorasi properti CSS. Namun temen2
tidak bisa membuat dekorasi yang berbentuk marquee (text berjalan)
tanpa bantuan kode HTML maupun Javascript.
Rasanya dengan mengandalkan kemampuan CSS saja sudah memadai untuk urusan dekorasi huruf. Nah, bagi temen2 yang suka dengan design blog – mungkin tulisan tentang Dekorasi Huruf dengan CSS ini bisa sedikit membantu.
CSS Properties | Preview |
---|---|
font-size:20px; font-family:Tahoma, Arial, Verdana; color:#000000; text-shadow:1px 1px 1px #AAAAAA; |
Begini
|
font-size:22px; font-family:Verdana,Tahoma, Arial; color:#0000FF; text-shadow:0px 1px 0px #FF0000; |
Begono
|
font-size:24px; font-family:Arial, Verdana, Tahoma; color:#FF0000; text-shadow:2px 2px 2px #000000; |
Begieu
|
font-size:26px; font-family:Times New Roman, Tahoma, Arial, Verdana; color:#FF0000; font-style: italic; font-weight:bold; text-shadow:3px 3px 3px #3B5998; |
Begitu
|
font-size:28px; font-family: Tahoma, Arial, Verdana; color:#CCCCCC; font-style: oblique; font-weight:bolder; text-transform:uppercase; text-shadow:3px 3px 3px #000000; |
Bagito
|
font-size:30px; font-family: Tahoma, Arial, Verdana; color:#114488; font-style: inherit; font-weight:bolder; text-transform:capitalize; text-decoration: blink; text-shadow:3px 3px 3px #627AAD; |
udeh ah Pegel
|
font-size:14px; font-family: Tahoma, Arial, Verdana; background: -moz-linear-gradient(top, #FFFFFF, #666); filter: progid; color:#737373; font-weight:bolder; text-transform:capitalize; text-shadow:0px 1px 0px #e5e5ee; |
akhirnya pingsan
|
1
2
3
4
5
6
| .h 1 { font-size : 20px ; font-family : Tahoma , Arial , Verdana ; color : #000000 ; text-shadow : 1px 1px 1px #AAAAAA ; } |
1
| .h 2 { font-size : 20px ; font-family : Tahoma , Arial , Verdana ; color : #000000 ; text-shadow : 1px 1px 1px #AAAAAA ; } |
Rasanya dengan mengandalkan kemampuan CSS saja sudah memadai untuk urusan dekorasi huruf. Nah, bagi temen2 yang suka dengan design blog – mungkin tulisan tentang Dekorasi Huruf dengan CSS ini bisa sedikit membantu.
Selamat Berdandan
Tidak ada komentar:
Posting Komentar