#CSS #WebDasturlash #Frontend #HTML #Background #Colors #LearnToCode
Darslarni davom ettiramizโฆ
Veb-sahifalar chiroyli koโrinishi uchun ranglar va fon tasvirlari muhim rol oโynaydi. Bugun CSS da rang berish usullari va fonni oโzgartirish usullarini oโrganamiz!
โ โ โ โ โ โ โ โ โ
๐จ CSS Ranglarni Qanday Berish Mumkin?
CSS da ranglarni berishning 3 xil usuli bor:
1๏ธโฃ Nom bilan (red, blue, green)
2๏ธโฃ RGB kodi bilan (rgb(255, 0, 0))
3๏ธโฃ Hex kodi bilan( #ff0000 , #00ff00 )
๐ RGB va Hex kodlari yordamida har qanday rangni yaratish mumkin!
โ โ โ โ โ โ โ โ โ
๐ผ๏ธ CSS Background โ Fonni Oโzgartirish
1๏ธโฃ Oddiy rang berish
2๏ธโฃ Rasmni fon sifatida qoโyish
3๏ธโฃ Gradient fon yaratish
๐ Tushuncha:
โ
background-color โ oddiy fon rangi.
โbackground-image โ fon tasviri.
โbackground-size: cover; โ tasvirni ekran boโylab toโliq joylashtirish.
โ linear-gradient() โ ranglarning yumshoq oโtishini yaratadi.
โ โ โ โ โ โ โ โ โ
๐ฏ Amaliy Misol
โฎ Oldingi postda "CSS asoslari โ veb-sahifalarni chiroyli qilish" mavzusi yoritilgan.
โญ Keyingi postda "CSS Shriftlar (Fonts) va Matnni Stilizatsiya Qilish" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
9. CSS Ranglar va Fon (Background) Bilan Ishlash
Veb-sahifalar chiroyli koโrinishi uchun ranglar va fon tasvirlari muhim rol oโynaydi. Bugun CSS da rang berish usullari va fonni oโzgartirish usullarini oโrganamiz!
โ โ โ โ โ โ โ โ โ
๐จ CSS Ranglarni Qanday Berish Mumkin?
CSS da ranglarni berishning 3 xil usuli bor:
1๏ธโฃ Nom bilan (red, blue, green)
h1 {
color: blue;
}2๏ธโฃ RGB kodi bilan (rgb(255, 0, 0))
p {
color: rgb(255, 0, 0);
}3๏ธโฃ Hex kodi bilan
h2 {
color: #ff0000;
}๐ RGB va Hex kodlari yordamida har qanday rangni yaratish mumkin!
โ โ โ โ โ โ โ โ โ
๐ผ๏ธ CSS Background โ Fonni Oโzgartirish
1๏ธโฃ Oddiy rang berish
body {
background-color: lightgray;
}2๏ธโฃ Rasmni fon sifatida qoโyish
body {
background-image: url("background.jpg");
background-size: cover;
background-position: center;
}3๏ธโฃ Gradient fon yaratish
body {
background: linear-gradient(to right, red, blue);
}๐ Tushuncha:
โ
โ
โ linear-gradient() โ ranglarning yumshoq oโtishini yaratadi.
โ โ โ โ โ โ โ โ โ
๐ฏ Amaliy Misol
<!DOCTYPE html>
<html lang="uz">
<head>
<meta charset="UTF-8">
<title>CSS Fonlar</title>
<style>
body {
background: linear-gradient(to right, #ff7e5f, #feb47b);
color: white;
text-align: center;
font-size: 24px;
padding: 50px;
}
</style>
</head>
<body>
<h1>CSS Ranglar va Fon</h1>
<p>Bu sahifada gradient fon qoโllanilgan.</p>
</body>
</html>
โฎ Oldingi postda "CSS asoslari โ veb-sahifalarni chiroyli qilish" mavzusi yoritilgan.
โญ Keyingi postda "CSS Shriftlar (Fonts) va Matnni Stilizatsiya Qilish" yoritiladi.
๐ @absJavaScript | #JaSc@absJavaScript
โคโ๐ฅ2๐ฅ2๐1