🪄 Frontend bilimlaringizni oshirish uchun 6 ta eng zo'r saytlar.
1) CSS battle
cssbattle.dev
2) Codepen challenges
codepen.io/challenges
3) Codewell
codewell.cc
4) Frontend Mentor
frontendmentor.io
5) Freecodecamp
freecodecamp.org
6) Java Script 30
javascript30.com
Manba 📚
@webdasturchilar_html_css_js
1) CSS battle
cssbattle.dev
2) Codepen challenges
codepen.io/challenges
3) Codewell
codewell.cc
4) Frontend Mentor
frontendmentor.io
5) Freecodecamp
freecodecamp.org
6) Java Script 30
javascript30.com
Manba 📚
@webdasturchilar_html_css_js
#css #misol
Marhamat, misol orqali ko'rishingiz mumkin...
body {
width: 100%;
height: 100vh;
background: linear-gradient(25deg, green, blue);
}
Manba 📚
@webdasturchilar_html_css_js
Marhamat, misol orqali ko'rishingiz mumkin...
body {
width: 100%;
height: 100vh;
background: linear-gradient(25deg, green, blue);
}
Manba 📚
@webdasturchilar_html_css_js
#useful
Fayl kengaytmalarining ingliz tilida qandag ma'no anglatishi.
Manba 📚
@webdasturchilar_html_css_js
Fayl kengaytmalarining ingliz tilida qandag ma'no anglatishi.
Manba 📚
@webdasturchilar_html_css_js
#css
CSSda chegaralar (border) - rasmda keltirilgan, aniqroq tushuntirishga harakat qildim.
📌 Bu yerda
border: 👉 chegara
1px 👉chegara qalinligi
solid 👉 chegara dizayni
#1092b2 👉 rang
Manba 📚
@webdasturchilar_html_css_js
CSSda chegaralar (border) - rasmda keltirilgan, aniqroq tushuntirishga harakat qildim.
📌 Bu yerda
border: 👉 chegara
1px 👉chegara qalinligi
solid 👉 chegara dizayni
#1092b2 👉 rang
Manba 📚
@webdasturchilar_html_css_js
#css
Marhamat - margin, border, padding, height va width haqida tushuncha. Juda ham sodda qilib tushuntirilgan.
Manba 📚
@webdasturchilar_html_css_js
Marhamat - margin, border, padding, height va width haqida tushuncha. Juda ham sodda qilib tushuntirilgan.
Manba 📚
@webdasturchilar_html_css_js
#html #css
CSS - box shadow haqida tushuncha!
Rasm orqali tushunishga osonroq deb o'ylayman.
Tushuncha 💡
box-shadow: 0 0 10px #00fff5;
1) 0 - soyaning "x" koordinata bo'yicha joylashuvi.
2) 0 - soyaning "y" koordinata bo'yicha joylashuvi.
3) 10px - xiralashish darajasi (blur).
4) #00fff5 - rang
Manba 📚
@webdasturchilar_html_css_js
CSS - box shadow haqida tushuncha!
Rasm orqali tushunishga osonroq deb o'ylayman.
Tushuncha 💡
box-shadow: 0 0 10px #00fff5;
1) 0 - soyaning "x" koordinata bo'yicha joylashuvi.
2) 0 - soyaning "y" koordinata bo'yicha joylashuvi.
3) 10px - xiralashish darajasi (blur).
4) #00fff5 - rang
Manba 📚
@webdasturchilar_html_css_js
#html #css
Box shadow haqida (2-qism)
Elementga berilgan soyani yorqinroq qilmoqchi bo'lsak, box-shadow berilgan qiymatlarni o'zgartirgan holda "vergul" orqali qo'shimcha ravishda berishimiz mumkin!
P.s Rasmda CSS koddagi box-shadowga qarang!
Manba 📚
@webdasturchilar_html_css_js
Box shadow haqida (2-qism)
Elementga berilgan soyani yorqinroq qilmoqchi bo'lsak, box-shadow berilgan qiymatlarni o'zgartirgan holda "vergul" orqali qo'shimcha ravishda berishimiz mumkin!
P.s Rasmda CSS koddagi box-shadowga qarang!
Manba 📚
@webdasturchilar_html_css_js
#html #css
TEXT DECORATION - CSS
📖 Matnlarga bezak beramiz, buning uchun "text-decoration" ishlatiladi.
P.s 5-jumlaga e'tibor bering, bir necha xil bezak bergan holda ranggini ham o'zgartirsa bo'ladi.
Manba 📚
@webdasturchilar_html_css_js
TEXT DECORATION - CSS
📖 Matnlarga bezak beramiz, buning uchun "text-decoration" ishlatiladi.
P.s 5-jumlaga e'tibor bering, bir necha xil bezak bergan holda ranggini ham o'zgartirsa bo'ladi.
Manba 📚
@webdasturchilar_html_css_js