bebas bayar, pembayaran mudah dan cepat, transaksi online, pembayaran tagihan dan tiket, transfer dana online

Thursday 5 November 2015

Jenis Font HTML dan Cara Merubahnya



                                                                             السلام عليكم


                                                           Salam Rahayu dan Damai selalu
Tulisan merupakan salah satu hal paling penting dalam website/blog, dengan keunikan dan kerapihan tulisan website anda maka pengunjung pun akan merasa lebih nyaman berada di dalam website kita.
Di kesempatan ini kita akan membahas cara mengubah font, warna huruf, jenis huruf, ukuran huruf, dan lain-lainnya untuk lebih mudahnya silahkan perhatikan tag di bawah ini

<font size="3" color="red">This is some text!</font>
<font size="2" color="yellow">This is some text!</font>
<font face="verdana" color="green">This is some text!</font> 

dan seperti ini hasilnya

This is some text!

This is some text!
This is some text!

seperti yang kita lihat di script di atas untuk membuat tag font kita menggunakan <font></font> di dalam tag tersebut bisa kita tambahkan atribut-atribut lainya untuk mengubah text, seperti size,color,face dll


<font size="2" color="blue">This is some text!</font>

<font face="verdana" color="green">This is some text!</font>

size digunakan untuk merubah besar kecilnya huruf kita bisa memasukan angka di dalamnya


face digunakan untuk merubah jenis font untuk namanya fontnya kita bisa mengcopynya dari msword atau dari control panel.


color seperti namanya digunakan untuk merubah warna huruf untuk color lebih disarankan untuk menggunakan code hexadecimal "#00000" - "#ffffff" untuk angka batasannya 1-9 untuk huruf A-F , kita tinggal tambahkan lambang "#" dan menambahkan 6 karakter gabungan angka atau huruf atau bisa juga angka semua untuk merubah warnanya.

untuk mengetahui kode warna, bisa dilihat di sidebar atau biar lebih puas ke daftar kode warna.


Berikut adalah contoh penulisan font-family:
selector {font-family: family-name, generic-family;}
Contoh real untuk pengaturan font selector heading (h1) di dalam CSS:

h1 {font-family: ”Trebuchet MS”, Helvetica, sans-serif;}

family-name
family-name adalah nama dari kumpulan beberapa font yang sejenis, seperti contoh Trebuchet MS Normal, Trebuchet MS Bold, Trebuchet MS Italic, Trebuchet MS Bold Italic, jadi family-name untuk font-font tersebut adalah Trebuchet MS.
Di dalam “family-name” kita bisa memasukkan lebih dari satu pilihan family-name, seperti contoh diatas ada “Trebuchet MS” dan “Helvetica” kemudian pada urutan terakhir ada “sans-serif” ini yang disebut dengan generic-family. Dianjurkan untuk selalu memasukkan generic-family pada setiap akhir dari properti font-family.
Untuk family-name yang menggunakan spasi atau lebih dari satu kata harus ditulis di dalam tanda petik, ”Trebuchet MS”,  "Lucida Sans Unicode" , "MS Gothic", "Palatino Linotype" dan masih banyak lainnya.
Ketika browser akan menampilkan konten yang berupa teks, font yang digunakan adalah yang berada di urutan pertama dari family-name, sebagai contoh diatas adalah Trebuchet MS, jika font-font ini tidak ditemukan maka browser akan mencoba mencari font-font berikutnya, yaitu jenis Helvetica. Dan jika font-font ini tidak ditemukan juga maka browser akan menggunakan standar font-nya masing-masing yang bertipe sans-serif sebagai alternatif terakhir.
Jadi untuk menghindari hal tersebut di atas maka dianjurkan bagi para pembuat website atau webmasters agar menggunakan font standar yang kemungkinan besar sudah tersedia di setiap komputer pengguna, .
generic-family
Terdiri dari 5 jenis type yaitu: serif, sans-serif, cursive, fantasy dan monospace.
Untuk lebih jelasnya perhatikan contoh berikut:


Tulisan dengan type serif Tulisan dengan type sans-serif Tulisan dengan type cursive Tulisan dengan type fantasy Tulisan dengan type monospace 

Dari hasil percobaan di 5 web browser untuk font type “fantasy” hanya Internet Explorer yang benar-benar berfantasi.
Contoh Font di Browser
Tipe Serif biasa digunakan untuk kebutuhan printer karena bentuknya yang lebih lembut dan halus, tipe sans-serif cocok digunakan untuk website karena lebih tebal dan jelas sehingga tulisan akan lebih mudah terbaca. Tipe cursive dan fantasy bisa digunakan untuk gambar maupun judul website dan tipe monospace adalah untuk kode dan membuat efek mesin ketik.
Font Families standar yang sering digunakan.

font-family: "Arial Black", Gadget, sans-serif;

Preview: “Arial Black”, Gadget, sans-serif;

font-family: Arial, Helvetica, sans-serif;

Preview: Arial, Helvetica, sans-serif;

font-family: "Andale Mono", "Monotype.com", monospace;

Preview: “Andale Mono”, “Monotype.com”, monospace;

font-family: "Bookman Old Style", serif;

Preview: “Bookman Old Style”, serif;

font-family: "Comic Sans MS", cursive;

Preview: “Comic Sans MS”, cursive;

font-family: "Courier New", Courier, monospace;

Preview: “Courier New”, Courier, monospace;

font-family: Courier, monospace;

Preview: Courier, monospace;

font-family: fixedsys, monospace;

Preview: fixedsys, monospace;

font-family: Georgia, serif;

Preview: Georgia, serif;

font-family: Garamond, serif;

Preview: Garamond, serif;

font-family: Impact, Charcoal, sans-serif;

Preview: Impact, Charcoal, sans-serif;

font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

Preview: “Lucida Sans Unicode”, “Lucida Grande”, sans-serif;

font-family: "Lucida Console", Monaco, monospace;

Preview: “Lucida Console”, Monaco, monospace;

font-family: "MS Gothic", monospace;

Preview: “MS Gothic”, monospace;

font-family: "MS Sans Serif", Geneva, sans-serif;

Preview: “MS Sans Serif”, Geneva, sans-serif;

font-family: "MS Serif", "New York", sans-serif;

Preview: “MS Serif”, “New York”, sans-serif;

font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;

Preview: “Palatino Linotype”, “Book Antiqua”, Palatino, serif;

font-family: Symbol, sans-serif;

Preview: Symbol, sans-serif;

font-family: System, sans-serif;

Preview: System, sans-serif;

font-family: Tahoma, Geneva, sans-serif;

Preview: Tahoma, Geneva, sans-serif;

font-family: Techno, Impact, sans-serif;

Preview: Techno, Impact, sans-serif;

font-family: "Times New Roman", Times, serif;

Preview: “Times New Roman”, Times, serif;

font-family: "Trebuchet MS", Helvetica, sans-serif;

Preview: “Trebuchet MS”, Helvetica, sans-serif;

font-family: Verdana, Geneva, sans-serif;

Preview: Verdana, Geneva, sans-serif;

font-family: Wingdings, "Zapf Dingbats", sans-serif;

Preview: Wingdings, “Zapf Dingbats”, sans-serif;

font-family: Webdings, sans-serif;

Preview: Webdings, sans-serif;

diambil dari berbagai sumber, mohon maaf bila ada kurang n lebihnya.
Mohon  koreksi dan pencerahannya.
Salam Rahayu selalu
والسلام عليكم


0 komentar:

Post a Comment

Terima kasih telah berkunjung, Berilah kami pencerahan dengan arif dan bijak

Facebook| Twitter| Google+| About | Privacy Policy | Sanggahan | Hubungi Kami
laatansabelajar ~ Copyright © 2016 by CB