Dekorasi Huruf menggunakan CSS

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.

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

Pastikan dan pasteu-kan kode tersebut berada dalam tanda { dan }. Sebagai contoh misalnya seperti berikut :

.h1  {
font-size:20px;
font-family:Tahoma, Arial, Verdana;
color:#000000;
text-shadow:1px 1px 1px #AAAAAA;
}

atau

.h2  { font-size:20px; font-family:Tahoma, Arial, Verdana; color:#000000; text-shadow: 1px 1px 1px #AAAAAA; }

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.

Selamat Berdandan
girl girl girl

Comment using your Facebook

Baru ada 11 respon di tulisan “Dekorasi Huruf menggunakan CSS

Tinggalkan Balasan

Alamat surel Anda tidak akan dipublikasikan. Isian wajib ditandai *

Anda dapat memakai tag dan atribut HTML ini: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>