CSS Part 12: FONT CSS
FONT CSS
ASSALAMUALAIKUM wr wb.
apa kabar teman teman kali ini saya akan membahas tentang macam macam font teman teman yang pernah menggunakan ms word pasti pernah menggunakan jenis font apa tapi saya tidak membahas tentang ms word tapi font yang ada di css berikut artikel yang membahas tentang font.
apa kabar teman teman kali ini saya akan membahas tentang macam macam font teman teman yang pernah menggunakan ms word pasti pernah menggunakan jenis font apa tapi saya tidak membahas tentang ms word tapi font yang ada di css berikut artikel yang membahas tentang font.
1.Pengertian CSS Font.
metode untuk mengatur huruf pada elemen tag html.
2.MAKSUD dan TUJUAN.
untuk mengetahui cara penggunaan font.
3.BAHAN dan ALAT.
- laptop/pc
-web browser contohnya seperti mozilla fire fox atau yang lain
-memiliki aplikasi seperti sublime text/notepad
4.Materi
CSS memberikan kita kemampuan penuh untuk mengatur jenis huruf elemen pada tag HTML.
properti CSS yang berhubungan dengan yang digunakan dalam CSS font antara lain :
1.font family
2.font style
3.font size
4.font weight
5.font variant
berikut contoh penerapan pada tag font diatas:
1.font family.
adalah tag yang digunakan untuk mengatur jenis pada huruf.
contoh script pada font family.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-family: "Arial verdana"
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
metode untuk mengatur huruf pada elemen tag html.
2.MAKSUD dan TUJUAN.
untuk mengetahui cara penggunaan font.
3.BAHAN dan ALAT.
- laptop/pc
-web browser contohnya seperti mozilla fire fox atau yang lain
-memiliki aplikasi seperti sublime text/notepad
4.Materi
CSS memberikan kita kemampuan penuh untuk mengatur jenis huruf elemen pada tag HTML.
properti CSS yang berhubungan dengan yang digunakan dalam CSS font antara lain :
1.font family
2.font style
3.font size
4.font weight
5.font variant
berikut contoh penerapan pada tag font diatas:
1.font family.
adalah tag yang digunakan untuk mengatur jenis pada huruf.
contoh script pada font family.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-family: "Arial verdana"
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
2.font style
adalah tag yang digunakan untuk mengatur gaya pada huruf biasanya digunakan untuk menentukan text miring.
contoh penggunaan pada font style.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-style: oblique;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
adalah tag yang digunakan untuk mengatur gaya pada huruf biasanya digunakan untuk menentukan text miring.
contoh penggunaan pada font style.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-style: oblique;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
3.font size.
digunakan untuk menentukan ukuran huruf.
biasanya yang digunakan satuan pixel.
contoh penggunaan font size
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-size: 30px;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
hasil dari sintaks diatas:
digunakan untuk menentukan ukuran huruf.
biasanya yang digunakan satuan pixel.
contoh penggunaan font size
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-size: 30px;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
hasil dari sintaks diatas:
4.font weight.
untuk menentukan berat font.
contoh penguunaan font weight.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-weight: bold;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
untuk menentukan berat font.
contoh penguunaan font weight.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-weight: bold;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
berikut hasilnya:
5.font variant.
untuk menentukan apakah sebuah teks harus ditampilkan dalam font kecil caps.
contoh penggunaan dari font variant:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-variant: small-caps;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
dibawah ini hasilnya:
untuk menentukan apakah sebuah teks harus ditampilkan dalam font kecil caps.
contoh penggunaan dari font variant:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
p{
font-variant: small-caps;
}
</style>
</head>
<body>
<p>
Dalam memilih jenis font untuk website, kondisi yang sama juga menjadi pertimbangan penting. Di dalam CSS, kita bisa menggunakan berbagai jenis font sesuai dengan desain yang diinginkan. Namun font yang akan ditampilkan pada web browser sepenuhnya berasal dari komputer user (pengunjung web). Jika kita memilih font yang tidak standar, maka desain web yang telah dirancang serapi mungkin akan menjadi ’kacau’ karena bisa saja font yang kita pilih tidak tersedia di komputer pengunjung.
</p>
</body>
</html>
dibawah ini hasilnya:
Sekian dari artikel terima kasih telah berkunjung semoga bermanfaat amin.
REFERENSI:
WASSALAMUALAIKUM wr wb.
Komentar
Posting Komentar