W3.CSS Google Font
Dengan W3.CSS sangat mudah untuk menambahkan font baru.
- Sangat mudah digunakan (hanya CSS dan HTML)
- Penggunaan tak terbatas perpustakaan font eksternal (Seperti Google Font)
- Bekerja di semua browser modern
Ini adalah Roboto
Ini adalah Sofia
Sofia terbakar
Membuat Web!
Membuat Web!
Membuat Web!
Membuat Web!
Membuat Web!
Menggunakan Google Font
Google Font gratis untuk digunakan, dan memiliki lebih dari 1000 font untuk dipilih.
Di bagian atas halaman web Anda, tautkan ke font Google:
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto">
Kemudian tambahkan CSS tentang tempat menggunakannya:
body,h1,h2,h3,h4,h5,h6 {font-family: Roboto, sans-serif;}
Contoh lain
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sophia">
body,h1,h2,h3,h4,h5,h6 {font-family: Sofia, serif;}
Buat Kelas Font
Di bagian atas halaman web Anda, tautkan ke font Google:
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sophia">
Kemudian buat kelas font:
Contoh
.w3-sofia {
font-family: Sofia, cursive;
}
Di halaman web Anda, gunakan kelas font:
Contoh
<p class="w3-sofia">Making the Web!</p>
Membuat Web!
Contoh
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tangerine">
.w3-tangerine {
font-family: 'Tangerine', serif;
}
<p class="w3-tangerine">Making the Web Beautiful!</p>
Membuat Web!
Contoh
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Lobster">
Membuat Web!
Contoh
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Lobster&effect=shadow-multiple">
Membuat Web!
Contoh
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Allerta+Stencil">
Membuat Web!