CSS Font dan Text

Ditulis oleh: -
Properti Font berfungsi untuk mengatur font pada suatu elemen HTML, baik itu jenisnya,ukurannya,gayanya ataupun variasinya.
Ada beberapa macam properti Font antara lain:

Tutorial

  • Font, untuk mengatur secara keseluruhan nilai-nilai yang digunakan pada suatu elemen.
    contoh:

p { font:bold 20px Arial, Helvetica sans-serif ;}
  • Font-family, untuk mengatur model/jenis font pada suatu elemen.
    contoh:
p { font-family:”Verdana” Arial Helvetica sans-serif ;}
  • Font-size, untuk mengatur ukuran font pada suatu elemen. Nilainya dapat berupa satuan unit, persentase, ataupun inherit, xx-small, x-small, small, smaller, xx-large, x-large, large, larger dan medium.
    contoh:
p { font-size:xx-large ;}
  • Font-style, untuk mengatur model/gaya font pada suatu elemen. Nilainya dapat berupa inherit, italic, normal dan oblique.
    contoh:
p { font-style:italic ;}
  • Font-weight, untuk mengatur tebal/tipis font pada suatu elemen. Nilainya dapat berupa bold, normal, inherit, bolder, lighter, ataupun satuan angka dari 100-900.
    contoh:
p { font-weight:bold;}
Properti Text berfungsi untuk mengatur gaya atau style teks pada suatu elemen.
Ada beberapa macam properti Text antara lain:
  • Text-align, untuk menentukan perataan teks pada suatu elemen.Nilainya dapat berupa left,center dan right.
    contoh:
p {text-align:left;}
  • Text-transform, untuk merubah teks menjadi huruf besar atau kecil pada suatu elemen. Nilainya dapat berupa uppercase, lowercase, capitalize dan none.
    contoh:
p {text-transform:uppercase;}
  • Text-indent, untuk mengatur jarak masuk teks pertama pada paragraf pada suatu elemen. Nilainya dapat berupa inherit atau satuan unit.
    contoh:
p {text-indent:4px;}
  • Line-height, untuk mengatur jarak baris antar teks pada suatu elemen. Nilainya dapat berupa persentase atau satuan unit.
    contoh:
p {line-height:14px;}
  • Letter-spacing, untuk mengatur jarak spasi antar teks pada suatu elemen. Nilainya dapat berupa inherit, normal, persentase atau satuan unit.
    contoh:
p {letter-spacing:1px;}
  • Text-decoration, untuk menentukan dekorasi teks pada suatu elemen. Nilainya dapat berupa underline, line-through, overline, blink dan none.
    contoh:
p {text-decoration:underline;}

0 komentar "CSS Font dan Text", Baca atau Masukkan Komentar

Posting Komentar