#CSS #WebDasturlash #Frontend #Fonts #Typography #HTML #LearnToCode
๐ @absJavaScript | #JaSc@absJavaScript
10. CSS Shriftlar (Fonts) va Matnni Stilizatsiya Qilish
๐ @absJavaScript | #JaSc@absJavaScript
๐ฅ2โคโ๐ฅ1โก1๐1
#CSS #WebDasturlash #Frontend #Fonts #Typography #HTML #LearnToCode
Veb-sahifada matnning koโrinishi juda muhim. Bugun CSS da shriftlar bilan ishlash va matnni stilizatsiya qilish usullarini oโrganamiz!
โ โ โ โ โ โ โ โ โ โ
๐ CSS Font Xususiyatlari
CSS da matn va shriftlarni boshqarish uchun quyidagi xususiyatlar ishlatiladi:
โ โ โ โ โ โ โ โ โ โ
๐ CSS da Oddiy Shrift Qoโllash
๐ Maslahat: sans-serif, serif, monospace kabi umumiy shrift oilalarini qoโshish yaxshiroq.
โ โ โ โ โ โ โ โ โ โ
๐ Google Fonts ishlatish(Maxsus shriftlar)
1๏ธโฃ Google Fonts saytidan shrift tanlaymiz: https://fonts.google.com
2๏ธโฃ HTML faylga qoโshamiz:
3๏ธโฃ CSS da ishlatamiz:
โ โ โ โ โ โ โ โ โ โ
๐ฏ Amaliy Misol
โ โ โ โ โ โ โ โ โ โ
โ
Endi veb-sahifalaringiz matnlari yanada chiroyli koโrinadi!
โฎ Avvalgi postda "CSS ranglar va fon (Background) bilan ishlash" mavzusi yoritilgan.
๐ @absJavaScript | #JaSc@absJavaScript
10. CSS Shriftlar (Fonts) va Matnni Stilizatsiya Qilish
Veb-sahifada matnning koโrinishi juda muhim. Bugun CSS da shriftlar bilan ishlash va matnni stilizatsiya qilish usullarini oโrganamiz!
โ โ โ โ โ โ โ โ โ โ
๐ CSS Font Xususiyatlari
CSS da matn va shriftlarni boshqarish uchun quyidagi xususiyatlar ishlatiladi:
โ โ โ โ โ โ โ โ โ โ
๐ CSS da Oddiy Shrift Qoโllash
p {
font-family: Arial, sans-serif;
font-size: 18px;
font-weight: bold;
font-style: italic;
text-align: center;
}๐ Maslahat: sans-serif, serif, monospace kabi umumiy shrift oilalarini qoโshish yaxshiroq.
โ โ โ โ โ โ โ โ โ โ
๐ Google Fonts ishlatish
1๏ธโฃ Google Fonts saytidan shrift tanlaymiz: https://fonts.google.com
2๏ธโฃ HTML faylga qoโshamiz:
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;600&display=swap" rel="stylesheet">
3๏ธโฃ CSS da ishlatamiz:
p {
font-family: 'Poppins', sans-serif;
}โ โ โ โ โ โ โ โ โ โ
๐ฏ Amaliy Misol
<!DOCTYPE html>
<html lang="uz">
<head>
<meta charset="UTF-8">
<title>CSS Shriftlar</title>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;600&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Poppins', sans-serif;
text-align: center;
}
h1 {
font-size: 32px;
font-weight: bold;
}
p {
font-size: 20px;
line-height: 1.5;
text-decoration: underline;
}
</style>
</head>
<body>
<h1>CSS Shriftlar va Matn</h1>
<p>Bu yerda maxsus shrift va matn effektlari qoโllangan.</p>
</body>
</html>
โ โ โ โ โ โ โ โ โ โ
โฎ Avvalgi postda "CSS ranglar va fon (Background) bilan ishlash" mavzusi yoritilgan.
๐ @absJavaScript | #JaSc@absJavaScript
โคโ๐ฅ2๐ฅ2๐1