Video: Memperbesar / Memperkecil Ukuran Fonts di HTML & CSS 2024
Salah satu cara termudah untuk menggunakan Dreamweaver untuk menambahkan font khusus ke situs Anda ditawarkan oleh Google. Google Web Font menawarkan koleksi font yang terbatas namun Anda bisa menggunakan semua font mereka secara gratis. Ikuti langkah-langkah ini untuk menambahkan salah satu font dari situs Google Web Fonts ke halaman Anda:
-
Buka browser web dan kunjungi situs Font Web Google .
-
Cari melalui font yang tersedia di situs dengan memilih jenis dan gaya font yang Anda cari.
Untuk mempersempit pencarian Anda, gunakan Filter (di kolom kiri). Anda dapat mengubah teks yang ditampilkan di setiap font dengan mengedit bidang Teks Pratinjau di bagian atas layar.
-
Temukan font yang Anda suka, lalu klik tombol Add to Collection biru di kanan bawah, tepat di bawah setiap nama font.
-
Klik kotak centang di sebelah masing-masing gaya font yang ingin Anda gunakan di halaman web Anda.
Kebanyakan font dalam Direktori Font Google hanya memiliki satu gaya. Meskipun Anda mungkin tergoda untuk memilih semua gaya, yang terbaik adalah memilih hanya yang akan Anda gunakan. Seperti yang Google peringatkan, semakin banyak gaya font yang Anda pilih, semakin lama waktu yang dibutuhkan untuk mendownload halaman web Anda.
-
Gulir ke bawah halaman dan pilih opsi Latin (untuk bahasa Inggris).
Jika Anda memerlukan karakter tambahan untuk bahasa lain, pilih opsi Latin Extended.
-
Gulir ke bawah halaman ke kotak biru dengan tiga tab; klik tab pertama untuk menautkan font ke situs web Anda.
Google menyediakan tiga pilihan: Standard, @import, dan JavaScript. Anda menemukan deskripsi rinci ketiganya di situs Google.
-
7. Salin tautan dari kolom tab Standar di Google seperti Anda akan menyalin teks atau kode lain dari halaman web.
-
Di Dreamweaver, tempelkan tautan ke bagian kepala halaman web Anda di antara tag yang terbuka dan tutup.
-
Kembali ke situs Font Google web dan di bagian bawah halaman, salin nama keluarga font.
Anda dapat menemukan nama keluarga font dalam Mengintegrasikan Font ke dalam area CSS Anda.
Dalam definisi gaya Anda, Anda harus menyertakan nama font persis seperti yang ditulis oleh Google. Copy-and-paste adalah cara terbaik untuk memastikan nama font cocok.
-
Di Dreamweaver, sisipkan nama keluarga font ke dalam aturan CSS di mana Anda ingin menggunakan font.
-
Terapkan aturan untuk teks di halaman web Anda.
Jika Anda menggunakan font dalam gaya pemilih Tag, seperti tag
, bila Anda menerapkan tag ke teks, font akan secara otomatis diterapkan sebagai bagian dari aturan. Jika Anda menggunakan font dalam gaya kelas atau ID, gaya itu kemudian harus diterapkan ke tag yang mengelilingi teks, seperti tag
atau tag.
-
Publikasikan halaman ke server web dan kemudian melihat pratinjau halaman di browser web untuk melihat fontnya.
Perhatikan bahwa ketika Anda menggunakan font Web Google Anda mungkin tidak melihat font yang ditampilkan di Dreamweaver, meskipun Anda menggunakan opsi Live view. Untuk memastikan bahwa font bekerja pada halaman Anda, Anda mungkin perlu mentransfer halaman ke server web menggunakan FTP dan melihat pratinjau halaman setelah dipublikasikan secara online.