Digital Cilacap - Kali ini kami akan membahas mengenai Menggunakan Typography Bootstrap 5. Kita bisa menggunakan style css huruf yang sudah disediakan di framework bootstrap. Banyak varian typography yang bisa digunakan saat kita membangun sebuah tampilan website. Berikut beberapa gaya yang patut kita ketahui untuk diaplikasikan di desain website kita.

Gaya Typography Bootstrap 5

Headings

Membuat Headings dengan typography bootstrap 5 (H1 sampai dengan H6)

untuk membuat gaya headings dengan typography bootstrap 5 ini cukup mudah, kamu tinggal menggunakan tag . Untuk ukuran font yang tampil, kita bisa menambahkan angka 1-6, semakin banyak angkanya, maka semakin kecil ukuran fontnya. Berikut contoh dalam menggunakannya:

Selain dengan cara codingan di atas, kita juga bisa membuat beberapa model ukuran font didalam sebuah tag (p) paragraf dengan menambahkan class "h" didalamnya.

Customizing headings

untuk membuat style typography bootstrap 5 dengan gaya Customizing headings dengan menyisipkan tag "small" didalam tag "h" headings. Ciri khas dari struktur codingan ini adalah ada bagian font yang lebih kecil ukurannya.

Display headings

Typography display headings bootstrap 5 digunakan untuk menonjolkan judul konten atau sub judul. Ciri khasnya dari settingan ini adalah font akan terlihat ramping sesuai dengan ukuran headings yang ditentukan. Penggunaanya hanya menambahkan class "display" pada tag headings

Lead

Membuat style paragraf yang berbeda dari paragraf lainnya yang terlihat kaku dengan struktur Lead. Kita hanya menambahkan class "lead" dalam tag paragraf.

Inline text elements

Typography inline text elements biasanya digunakan dalam sebuah tag paragraf agar paragaf tersebut memiliki style grafis / ukuran yang berbeda. Kita bisa menambahkan beberapa model tag didalam paragraf

tag (mark) untuk membuat highlight pada text yang ditandai

tag (del) untuk membuat coretan / garis bagian tengah huruf

tag (s) digunakan untuk membuat coretan garis juga

tag (ins) digunakan untuk membuat garis bawah

tag (u) ini juga bisa juga digunakan untuk membuat garis bawah tulisan

tag (small) membuat font paragraf menjadi lebih kecil

tag (strong) membuat font paragraf menjadi lebih kuat atau tebal

tag (em) membuat font miring

Abbreviations

Penambahan tag (abbr) didalam tag paragraf untuk menghasilkan typography yang ketika disorot oleh kursor akan menghasilkan title yang muncul.

Blockquotes

Typography blockquotes digunakan untuk membuat style kutipan. Biasanya digunakan untuk konten yang berisi dari kutipan lain, dan informasi sumber kutipan tersebut dibuatlah sebuah style.

Naming a source

ini juga hampir sama fungsinya dengan blockquote, namun typography naming a source ini lebih spesifik dan agak panjang dalam codingannya. Didalam tag blockquote kita sisipi tag "figcaption" untuk membuat style font terlihat kecil dan sedikit kurang menonjol

Alignment

Typography alignment ini digunakan untuk perataan, mau rata kanan, kiri atau tengah. berikut codingannya

Lists

Jenis typography bootstrap 5 ini digunakan dalam membuat list item. Biasanya diselimuti dulu oleh tag "ul" kemudian didalamnya berisi tag "li"

Inline

Typography inline ini membuat style list item menjadi satu baris

Description list alignment

jenis ini cocok digunakan dalam penjajaran istilah dan deskripsi yang nanti akan ditampilkan sejajar horizontal (yang terdiri dari dua kolom)

Itulah beberapa penggunaan typography bootstrap 5 yang bisa kami informasikan. semoga bermanfaat. tunggu pembahasan selanjutnya yang berkaitan mengenai pembejaran bootstrap 5.

menggunakan typography bootstrap 5