Untuk menentukan jenis huruf atau font baik dalam membuat sebuah artikel dengan menggunakan kode HTML, sangat berhubungan sekali dengan jenis font yang ter-install di komputer atau laptop kita. Jadi apabila kita akan menampilkan jenis huruf di blog, pastikan bahwa jenis font tersebut sudah ter-install di komputer atau laptop.
Untuk mengatur tampilan blog, baik untuk mengatur jenis huruf atau font, background (Latar belakang), Main color (Warna utama) pada sebuah blog secara keseluruhan dilakukan pada Desainer Tema Blogger
Apabila dalam membuat postingan ataupun dalam Edit HTML template blog kita tidak menentukan jenis huruf maka jenis huruf yang ditampilkan di browser adalah jenis font atau huruf sesuai pengaturan di Desainer Tema Blogger. Namun apabila kita ingin menampilkan jenis huruf atau font yang berbeda dari pengaturan tersebut baik pada postingan atau pada Edit HTML blog, ada beberapa Tag HTML yang dapat digunakan. Namun di sini saya hanya akan mencatat menentukan Jenis dan Ukuran Font/Huruf dengan menggunakan Tag <span></span> dengan atribut dan nilai atributnya yaitu style="font-family:""
Menentukan Jenis Huruf dengan HTML
Sebagai contoh dalam membuat postingan atau pada teks tertentu kita ingin menggunakan jenis font broadway, maka penulisan kode kode HTML-nya :
Ini merupakan contoh teks menggunakan jenis huruf <span style="font-family: broadway"> Dan Ini merupakan hasil teks menggunakan jenis font "broadway"
Hasilnya :
Ini merupakan contoh teks menggunakan jenis huruf broadway Dan Ini merupakan hasil teks menggunakan jenis font "broadway"
Untuk mengganti jenis font, silahkan ganti kode yang diberi warna biru
Menentukan Jenis font Dengan Menambahkan Jenis font Alternatif
Dalam menentukan jenis font seperti diatas, ada kemungkinan jenis huruf yang diinginkan tersebut ternyata tidak ada atau tidak ter-instal di komputer/laptop kita atau juga kita salah mengetik jenis huruf tersebut. Untuk mengantisipasi jenis font tersebut tidak ada di komputer/laptop atau salah ketik jenis font, maka kita bisa menambahkan jenis font alternatif.
Contoh :
- Jenis font yang pertama adalah jenis font times new roman misalnya kita salah mengetik jenis font tersebut menjadi times newS roman yaitu kelebihan huruf S pada teks new
- Jenis font yang kedua adalah jenis font verdana misalnya kita salah mengetik jenis font tersebut menjadi verdan yaitu huruf a tidak ada
- Jenis font yang ketiga adalah jenis font courier new dan tidak ada kesalahan dalam pengetikan serta sudah ter-instal di komputer/laptop
Contoh penulisan kode HTML-nya :
<span style="font-family: times newS roman, verdan, courier new">Ini merupakan contoh teks menggunakan font alternatif</span>
Hasilnya :
Ini merupakan contoh teks menggunakan font alternatif
Dari hasil tampilan di browser maka jenis font yang dibaca adalah jenis font yang ter-instal di komputer/laptop dan juga jenis font yang tertulis benar. Jenis font timse newS roman dan jenis font verdan dianggap tidak ada karena kita salah mengetik maka yang dibaca adalah font courier new. Jadi dengan menambahkan jenis font lebih dari satu menjadi sebuah alternatif apabila jenis font yang diinginkan tidak ada atau salah ketik.
Menentukan Ukuran Huruf dengan HTML
Selain untuk menentukan jenis font, kita juga bisa menentukan ukuran font tersebut dengan menambahkan nilai atribut font-size: maka penulisan kode kode HTML-nya :
Hasilnya :
Contoh huruf dengan ukuran xx-small (huruf terkecil)<span style="font-size: x-small;">Contoh huruf dengan ukuran x-small (huruf kecil)</span>
Hasilnya :
Contoh huruf dengan ukuran x-small (huruf kecil)<span style="font-size: small;">Contoh huruf dengan ukuran normal</span>
Hasilnya :
Contoh huruf dengan ukuran normal<span style="font-size: medium;">Contoh huruf dengan ukuran sedang</span>
Hasilnya :
Contoh huruf dengan ukuran sedang<span style="font-size: large;">Contoh huruf dengan ukuran besar</span>
Hasilnya :
Contoh huruf dengan ukuran besar<span style="font-size: x-large;">Contoh huruf dengan ukuran terbesar</span>
Hasilnya :
Contoh huruf dengan ukuran terbesar<span style="font-size: 80%;">Contoh huruf dengan menggunakan persentase</span>
Hasilnya :
Contoh huruf dengan menggunakan persentase<span style="font-size: 21px">Contoh huruf dengan menggunakan ukuran pixel</span>
Hasilnya :
Contoh huruf dengan menggunakan ukuran pixelMenggabungkan Jenis Huruf dan Ukuran Huruf dengan HTML
Hasilnya :
Contoh teks menggunakan jenis huruf "courier new" dengan ukuran huruf 20 pixelJenis dan ukuran huruf bisa digunakan pada beberapa Tag yang memiliki atribut style yang dapat dilihat pada tabel Jenis-Jenis Nilai Atribut Style Untuk Memperindah Tampilan Blog
Tidak ada komentar:
Posting Komentar
Silahkan tulis komentar / saran-sarang yang membangun di sini !