CSS Teks

Memformat teks dengan CSS

Untuk memformat teks, ketahui terlebih dahulu bagian-bagian (property) teks yang mana saja yang bisa diformat.

Tabel daftar bagian-bagian (property) teks yang paling sering diformat:

No.	Bagian teks Property	Nama Property	Isi Value
1.	Ukuran teks	font-size	px / em / pt
2.	Ketebalan teks.	font-weight	bold / bolder / 400 - 900
3.	Kemiringan teks.	font-style	normal,italic
4.	Ketinggian baris teks.	line-height	em / px
5.	Jarak huruf.	letter-spacing	em / px
6.	Perubahan huruf kecil ke besar.	text-transform	lowercase / uppercase
7.	Dekorasi teks.	text-decoration	underline / line-trought / overline
8.	Warna teks.	color	nama warna / Hex / RGB
9.	Warna latar belakang teks.	background	nama warna / Hex / RGB
10.	Alinea teks.	text-align	left / center / right / justify
11.	Jenis teks.	font-family	nama jenis font

<p class='format'>Ini adalah teks paragraf format.</p>
<p class='format-2'>Ini adalah teks paragraf format-2.</p>
<p class='format-3'>Ini adalah teks paragraf format-3.</p>

<style>
p {   
  line-height: 25px;
}
p.format {
   font-weight: bold;
   font-size: 20px;
   font-family: Garamond,serif;
   line-height: 25px;
   color: white;
   background: dodgerblue
}
p.format-1 {
   font:600 18px Helvetica,sans-serif;
  }
p.fotmat-2 {
   text-transform: uppercase;
   text-decoration: overline;
}
p.format-3 {
   font-style: italic;
   letter-spacing: 10px;
   text-decoration: underline;
   }
</style>

Ujicoba

Hasil pemformatan :

Ini adalah teks paragraf format.

Ini adalah teks paragraf format-1.

Ini adalah teks paragraf format-2.

Ini adalah teks paragraf format-3.