Font style dan Text Layout CSS Property


Topik CSS berikutnya adalah penataan teks, Di sini kita akan membahas dasar-dasar gaya /style teks termasuk pengaturan diantaranya pengaturan CSS untuk font, tebal, miring, spasi baris dan huruf, serta fitur teks lainnya.

Properti CSS yang digunakan pada teks umumnya terbagi dalam dua kategori :

font-style : Properti yang mempengaruhi font teks, misalnya font mana yang diterapkan, ukurannya, dan apakah itu tebal, miring, dll.

Text layout style : Properti yang memengaruhi penspasian dan fitur tata letak teks lainnya, untuk memanipulasi, misalnya, ruang antara baris dan huruf, dan bagaimana teks disejajarkan di dalam kotak konten.

CSS menyediakan empat properti umum, untuk mengubah bobot visual/penekanan pada teks :

1. font Style : digunakan untuk mengaktifkan atau menonaktifkan teks miring. Nilai yang mungkin adalah sebagai berikut :

font-style : normal ;
font-style : italic ;
font-style : oblique ;

normal : Mengatur teks ke font normal (menonaktifkan huruf miring yang ada).
italic : Mengatur teks untuk menggunakan versi huruf miring,
oblique : Mengatur teks untuk menggunakan versi simulasi dari font miring, yang dibuat dengan memiringkan versi normal.

2. font-weight : Mengatur seberapa tebal teks. Ini memiliki banyak nilai yang tersedia jika kita memiliki banyak varian font yang tersedia (seperti light, normal, bold, extrabold, black, dll.), tetapi ini jarang digunakan kecuali normal dan bold : Nilai yang digunakan meliputi.

font-weight : normal ;
Font-weight : bold ;
Font-weight : bolder ;
atau bias juga menggunakan value nilai 100 - 900

normal, bold : Mengatur ketegasan elemen saat ini menjadi satu langkah lebih ringan atau lebih berat dari ketegasan elemen induknya. 100 – 900: Nilai ketebalan numerik yang memberikan kontrol lebih halus.

3. text-transform : Memungkinkan kita mengatur font untuk diubah. Nilai yang digunakan meliputi:

text-transform : none ;
text-transform : uppercase ;
text-transform : lowercase ;
text-transform : capitalize ;
text-transform : fullwidth ;

none : Mencegah transformasi apa pun.
uppercase : Mengubah semua teks menjadi huruf kapital.
lowercase : Mengubah semua teks menjadi huruf kecil.
capitalize : Mengubah semua kata menjadi huruf kapital pertama.
fullwidth : Mengubah semua bagian dalam persegi dengan lebar tetap / fixed.

4. text decoration : menerapkan/menghapus dekorasi teks pada font menghapus garis bawah default pada tautan atau link. Nilai yang tersedia adalah:

text decoration : none ;
text decoration : underline ;
text decoration : overline ;
text decoration : line-through ;

none : Membatalkan set dekorasi teks apa pun yang sudah ada.
underline : Menggaris bawahi teks.
overline : Memberikan teks overline.
line-through : Menempatkan coretan di atas teks.

Demikian penjelasan dari Font style property untuk mengatur font/text pada layout, kita akan bahas tutorial CSS dan HTML lainnya ya. semoga bermanfaat.

Subscribe

Youtube

Join with

Shutterstock

Donate with

PayPal

Tidak ada komentar:

Posting Komentar