CSS font adalah properti dari CSS untuk mengatur huruf yang akan ditampilkan dihalaman blog kita.Ada bermacam macam value yang bisa kita berikan.Kita contohkan dasar-dasar CSS font yang paling banyak dipakai yaitu;
font-color
Untuk mengatur warna huruf yang kita inginkan.
Untuk menentukan value atau warna sebaiknya kita berpedoman kepada tabel warna HTML,jika menginginkan warna yang lengkap.
Kode warna bisa ditulis dengan model hexadecimal,RGB ataupun kata.
Contoh penulisan warna(value);
RGB :rgb(20,43,234)
HEX : #FF000
KATA : RED
Contoh penulisan;
p{font-color: #FF0000}
Contoh penampakan;
Ini adalah contoh warna #FF0000
font-family
untuk menampilkan jenis-jenis font yang ingin kita pakai,valuenya adalah dari macam macam jenis huruf,ini beberapa contohnya;
Value
verdana
arial
sans-serif
georgia
dll
Contoh penulisan;
p{font-family: verdana}
p{font-family: arial}
Contoh penampakan;
font-size
Untuk mengatur ukuran dari huruf
Value yang bisa kita masukkan disebut satuan,kita bisa menggunakan satuan ukuran;
Value
pixel (px)
point (pt)
Em (em)
inch (in)
persen (%)
Satuan px,pt dan in adalah satuan absolut artinya memiliki ukuran yang bersifat tetap.
Satuan em dan % (persen) bersifat relatif,atau dinamis yang artinya menyesuaikan dengan konfigurasi user.Em adalah satuan yang menyesuaikan dengan ukuran default font browser,sedangkan % itu menyesuaikan dengan resolusi dari monitor atau layar.
Bisa juga dengan perintah kata,misalnya large,small ataupun x-large.Ini bersifat relatif ,menyesuaikan dengan monitor perangkat yang dipakai.
Contoh penulisan;
p{font-size: 12px}
p{font-size: 1.2em}
p{font-size: 12pt}
p{font-size: 0.1in}
p{font-size: 95%}
p{font-size: small}
p{font-size: large}
p{font-size: x-large}
Contoh penampakan;
ini adalah contoh ukuran
ini adalah contoh ukuran
ini adalah contoh ukuran
ini adalah contoh ukuran
font-weight
Untuk menentukan apakah huruf dibikin tebal atau normal
value
bold ,,jika menginginkan huruf menjadi tebal
normal ,jika menginginkan huruf normal.Hanya perlu ditulis jika ini adalah elemen turunan dan induknya menggunakan font-weight :bold,tetapi kita menginginkan huruf normal pada elemen ini)
Contoh penulisan;
p{font-weight: bold}
Contoh penampakan;
Ini adalah contoh font-weight: bold
font-style
Sesuai dengan namanya,yaitu style alias gaya dari huruf
Value yang umum dipakai adalah italic atau oblique,kayaknya hanya persamaan kata saja.
Contoh penulisan:
p{font-style: italic}
p{font-style: oblique}
Contoh penampakan
Ini adalah font italic
Ini adalah font oblique
text-decoration
Text-decoration hampir sama dengan font style,yaitu hanya untuk menambahkan semacam efek pada kata.
Value
underline,jika menginginkan sebuah kata / huruf memakai garis bawah.
blink,jika menginginkan kata atau huruf berkedip kedip.
strike,jika ingin memberi garis coret pada text
noneJika tidak menginginkan sebuah decoration pada sebuah elemen,dengan asumsi selector yan berada diatas elemen ini menggunakan properti text-decoration .
Contoh penulisan;
p{text-decoration: none}
p{text-decoration: underline}
p{text-decoration: blink}
p{text-decoration: strike}
Contoh penampakan
Ini adalah text-decoration underline
text-align
Berfungsi untuk mengatur posisi kata/huruf
Value
left ,adalah rata kiri
right,adalah rata kanan
center,adalah berada ditengah
justify ,rata kiri dan kanan
Contoh penulisan;
p{text-align: left}
p{text-align: right}
p{text-align: center}
p{text-align: justify}
Contoh penampakan
Ini adalah rata kiri(text-align: left)
Ini adalah tengah(text-align : center)
Text-transform
Ini berfungsi untuk merubah model huruf
Value
uppercase,jika menginginkan huruf balok/besar semua,walau tulisan diketik dengan huruf biasa.
none,jika tidak menginginkan fungsi ini.
Contoh penulisan;
p{text-transform: uppercase}
p{text-transform: none}
Contoh penampakan;
INI ADALAH CONTOH DARI TEXT-UPPERCASE
Segitu dulu untuk dasar CSS font dan penjelasan secara singkat.
