Posting di BlogDETIK dengan Berbagai Jenis Font

Menampilkan teks variatif tentu akan membuat BlogDETIK kita menjadi tampil beda. Sebuah warna baru bagi blog yang pastinya bikin tampilan blog tambah bergaya. Selain bermanfaat untuk memperindah wajah blog, pemakaian jenis font berbeda dapat dipergunakan untuk memberi tekanan (ciri, identitas) pada beberapa teks tertentu yang kita anggap penting untuk ditonjolkan supaya perhatian pembaca spontan tersedot ke arah teks dimaksud. Satu contoh misalnya kita manfaatkan untuk membentuk sebuah link sehingga terlihat menonjol atau berbeda dibandingkan dengan teks sekitarnya. Bagi d'blogger yang sering mempostingkan karya sastra seperti halnya puisi, tentunya berbagai macam gaya tulisan ini juga akan semakin membuat postingnya lebih berasa seni. Sangat variatif teks yang akan bisa kita bentuk dan gunakan karena kita bisa membuat ukuran huruf dan warna yang berbeda pula. Oke ...?! Untuk membuat keindahan seperti teks-teks yang aku tampilkan diatas sangat gampang dan sederhana. Beberapa kodeHTML akan kita manfaatkan seperti : font-style, font-family, font-weight, color, font-size, dan padding.

Kode HTML untuk membuat teks Variatif :

<span style="font-weight:bold;font-style:italic;padding:2px 10px">Letakkan Teks di sini!</span>

1. Color :Sampeyan bisa menggunakan dua model kode untuk warna :
   • Color:#f3fb96; , atau
   • Color:blue;
   • #f3fb96 dan blue bisa diganti dengan kode warna dalam bentuk angka atau teks (misalnya:#333, red atau yang lain tergantung yang sampeyan inginkan).
2. font-weight : Tiga macam ketebalan huruf bisa digunakan :
   • font-weight:normal; » digunakan untuk ketebalan standar (normal)
   • font-weight:bold; » sedikit lebih tebal dari tebal standar
   • font-weight:bolder; » untuk huruf paling tebal.
3. font-style : digunakan untuk membentuk huruf miring dan normal :
   • font-style:normal; » digunakan untuk bentuk huruf normal (tegak lurus)
   • font-style:italic; » digunakan membuat huruf miring.
4. font-family:Times New Roman; » berfungsi membentuk berbagai variasi bentuk (model) huruf (font), dimana sampeyan bisa mengganti Times New Roman dengan berbagai jenis yang lain seperti misalnya :Verdana, Arial, Cataneo BT, Cursive, Comic Sans MS, Helvetica, Times, Monotype Corsiva, Arial Narrow atau jenis font (font-family) yang lain.Jika ingin data lebih lengkap silahkan KLIK link di bawah ini :
   Berbagai Macam Font (huruf) untuk Blog
5. font-size:12px; » 12px adalah ukuran font. Silahkan ganti sesuai kebutuhan sampeyan, misalnya 8px, 10px, 11px, 14px, 22px, 32px ... dst.
6. padding:2px 10px; difungsikan sebagai pengatur jarak dengan teks/kata/huruf di sebelah kanan dan kirinya. Nilai 10px bisa dikurangi atau diperbesar untuk menciptakan jarak yang ideal terhadap teks di sampingnya.

Apabila sampeyan ingin melihat atau meng-copy daftar lengkap kode warna, baik yang berupa kode angka ataupun teks, silahkan KLIK link di bawah ini :
Tabel Daftar Nama dan Kode Angka Warna

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

Update » Rebo LEGI, Maret, 28, 2012

» Happy Blogging - gubhugreyot «

16.39 | 0 komentar | Read More

Tutorial BLOGGER: Konversi px, em, pt dan % dalam CSS

Satuan yang digunakan sebagai ukuran dalam KODE CSS memang tidak hanya menggunakan satu macam satuan. Dari beberapa satuan yang dikenal, yang paling sering digunakan dalam desain web atau blog adalah em, px, pt dan %. Bagaimana konversi dari ke-4 satuan tersebut sehingga dengan cepat kita dapat memahami ukuran sebenarnya ?

pt	px	em	%
6	8	0.5	50
7	9	0.55	55
7.5	10	0.625	62.5
8	11	0.7	70
9	12	0.75	75
10	13	0.8	80
10.5	14	0.875	87.5
11	15	0.95	95
12	16	1	100
13	17	1.05	105
13.5	18	1.125	112.5
14	19	1.2	120
14.5	20	1.25	125
15	21	1.3	130
16	22	1.4	140
17	23	1.45	145
18	24	1.5	150
20	26	1.6	160

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

Update » January, 08, 2012

» Happy Blogging - gubhugreyot «

17.55 | 0 komentar | Read More

Font-Family yang sering digunakan dalam KODE HTML: Panduan BloGGeR Font

Tutorial BloGGeR dan Panduan BlogDETIK tentang berbagai Jenis font yang bisa dimanfaatkan ketika ngeblog ini akan sangat bermanfaat untuk menciptakan berbagai variasi bentuk teks yang membuat blog tampil lebih segar dan tidak tampak monoton. Berbagai macam bentuk font diciptakan melalui kode css atau kode html seperti :

Contoh Kode CSS :

h3{font-family:Cataneo BT;font-size:1em;color:blue; ...dst }, atau yang lain misalnya :
span.antik {font-family:monotype Corsiva;font-size:22px;font-weight:bold; ...dst }

Contoh Penggunaan di Kode HTML :

<div style="background:#555;color;:blue;font-family:Cursive;font-weight:bold;font-size:27px;padding:5px;float:left; .... dst;"> Teks dan isi yang lain </div>

Tabel Font-Family :

KODE :	Bentuk Font :
font-family:Arial;	Arial
font-family:Arial Narrow;	Arial Narrow
font-family:Arial Unicode MS;	Arial Unicode MS
font-family:Cataneo BT;	Cataneo BT
font-family:Comic Sans MS;	Comic Sans MS
font-family: Courier;	Courier
font-family:Courier New;	Courier New
font-family:Cursive;	Cursive
font-family:Dauphin;	Dauphin
font-family:Georgia;	Georgia
font-family:Helvetica;	Helvetica
font-family:Helvetica Neue;	Helvetica Neue
font-family:Lucida;	Lucida
font-family:Lucida Console;	Lucida Console
font-family:Lucida Sans;	Lucida Sans
font-family:Monospace;	Monospace
font-family:Monotype Corsiva;	Monotype Corsiva
font-family: Sans serif;	Sans serif
font-family:Sans-serif;	Sans-serif
font-family:MS Sans serif;	MS Sans serif
font-family:Square721 BT;	Square721 BT
font-family:Tahoma;	Tahoma
font-family:Times New Roman;	Times New Roman
font-family:Trebuchet;	Trebuchet
font-family:Trebuchet MS;	Trebuchet MS
font-family:Frutiger;	Frutiger
font-family:Droid Serif;	Droid Serif
font-family:Geneva;	Geneva
font-family:Fantasy;	Fantasy
font-family:Palatino Linotype;	Palatino Linotype
font-family:Impact;	Impact
font-family:Calisto MT;	Calisto MT

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

Update » January, 08, 2012

» Happy Blogging - gubhugreyot «

15.59 | 0 komentar | Read More

Mengatur Tebal Huruf

Tebal font dikenali dengan atribut font-weight. Merupakan atribut yang dipergunakan untuk merubah tebal dan tipisnya font. Dalam penggunaannya ada beberapa macam ketebalan font :

normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900


Contoh cara Penggunaan atribut font-weight:

1. Di antara tag <head> dan </head>

.GRmenu{
font: 12px Verdana bold;
        background:#fff;
        ...: ....;
        ...: ....;
}

atau :

.GRmenu{
        font-weight:bolder;
        font: 12px verdana;
        background:#fff;
        ...: ....;
        ...: ....;
}

2. Di antara tag <body> dan </body>

<span style="font-weight:400; font-family:Verdana; size:18px;">font-weight: 400</span>

<span style="font-weight:900; font-family:Verdana; size:18px;">font-weight: 900</span>

<span style="font-weight:normal; font-family:Verdana; size:18px;">font-weight: normal</span>

<span style="font-weight:lighter; font-family:Verdana; size:18px;">font-weight: lighter</span>

<span style="font-weight:bold; font-family:Verdana; size:18px;">font-weight: bold</span>

<span style="font-weight:bolder; font-family:Verdana; size:18px;">font-weight: bolder</span>

Bentuknya menjadi seperti di bawah ini :

font-weight : 100

font-weight: 400

font-weight: normal

font-weight: lighter

font-weight: bold

font-weight: bolder

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

Update » Jemuah LEGI, Maret, 23, 2012

» Happy Blogging - gubhugreyot «

03.36 | 0 komentar | Read More