CSS3 - Font Web
Font web digunakan untuk mengizinkan font dalam CSS, yang tidak diinstal pada sistem lokal.
Format font web berbeda
Sr.No. | Font & Deskripsi |
---|---|
1 | TrueType Fonts (TTF) TrueType adalah standar font garis besar yang dikembangkan oleh Apple dan Microsoft pada akhir 1980-an, itu menjadi font yang paling umum untuk sistem operasi Windows dan MAC. |
2 | OpenType Fonts (OTF) OpenType adalah format untuk font komputer yang dapat diskalakan dan dikembangkan oleh Microsoft |
3 | The Web Open Font Format (WOFF) WOFF digunakan untuk pengembangan halaman web dan dikembangkan pada tahun 2009. Sekarang menggunakan rekomendasi W3C. |
4 | SVG Fonts/Shapes SVG mengizinkan font SVG dalam dokumentasi SVG. Kita juga bisa menerapkan CSS ke SVG dengan properti font face. |
5 | Embedded OpenType Fonts (EOT) EOT digunakan untuk mengembangkan halaman web dan telah tertanam di halaman web sehingga tidak perlu mengizinkan font pihak ketiga |
Kode berikut menunjukkan kode contoh font face -
<html>
<head>
<style>
@font-face {
font-family: myFirstFont;
src: url(/css/font/SansationLight.woff);
}
div {
font-family: myFirstFont;
}
</Style>
</head>
<body>
<div>This is the example of font face with CSS3.</div>
<p><b>Original Text :</b>This is the example of font face with CSS3.</p>
</body>
</html>
Ini akan menghasilkan hasil sebagai berikut -
Deskripsi font
Daftar berikut berisi semua deskripsi font yang ditempatkan dalam aturan @ font-face -
Sr.No. | Nilai & Deskripsi |
---|---|
1 | font-family Digunakan untuk mendefinisikan nama font |
2 | src Digunakan untuk mendefinisikan URL |
3 | font-stretch Digunakan untuk menemukan, bagaimana font harus direntangkan |
4 | font-style Digunakan untuk mendefinisikan gaya font |
5 | font-weight Digunakan untuk mendefinisikan berat font (tebal) |