Typography CSS

p {
color: #666666;
}
Pada contoh di atas, kita menentukan warna font hitam (#333333) pada tag < h1> dan warna font abu-abu (#666666) pada tag < p>.

4. Spacing dan Alignment Font CSS

Terakhir, kita juga harus mengatur spacing dan alignment pada teks agar tampilan artikel lebih terstruktur dan mudah dibaca oleh pengguna. Kita dapat menggunakan property CSS seperti margin, padding, text-align, dan line-height untuk mengatur spacing dan alignment pada teks.

.container {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

h1 {
  text-align: center;
  margin-bottom: 30px;
}

p {
  text-align: justify;
  margin-bottom: 20px;
}

Pada contoh di atas, kita menggunakan property margin dan padding pada container untuk memberikan jarak antara teks dengan elemen lain pada halaman web. Selain itu, kita juga menggunakan property text-align pada tag < h1> dan tag < p> untuk mengatur alignment pada teks, dan memberikan property margin-bottom pada tag < h1> dan tag < p> untuk memberikan jarak antara teks dengan elemen di bawahnya.

Dengan menggunakan teknik typography CSS seperti di atas, tampilan teks pada halaman web artikel tentang teknologi tersebut menjadi lebih menarik dan mudah dibaca oleh pengguna. Selain itu, tampilan teks yang terstruktur dan mudah dibaca juga dapat meningkatkan pengalaman pengguna dalam membaca artikel tersebut.

Selain teknik typography CSS yang telah dijelaskan di atas, terdapat juga teknik-teknik lain seperti letter-spacing, text-transform, dan font-style yang dapat digunakan untuk mengatur tampilan teks pada halaman web. Pemilihan teknik typography CSS yang tepat harus disesuaikan dengan kebutuhan dan tujuan dari halaman web yang dibuat.

Follow us on