</> Softromeda Edu

🌐 HTML va CSS

Veb sahifa yaratishni noldan o'rganing - 20 bosqichli amaliy qo'llanma

📚 20 bo‘lim 🎯 Boshlang‘ich 👁 133 ko‘rish
O‘qishni boshlash

Darslik haqida

HTML va CSS - internetdagi har bir sahifaning poydevori. Ushbu darslikda siz vebning ishlash prinsipidan boshlab, HTML teglari, formalar, semantik tuzilma, CSS selektorlari, box model, Flexbox, Grid, moslashuvchan (responsive) dizayn va zamonaviy CSS imkoniyatlarini o'rganasiz. Har bir bo'limda tayyor kod misollari va amaliy topshiriqlar bor. Darslik yakunida to'liq ishlaydigan shaxsiy portfolio saytini noldan yaratasiz. Kod ichidagi klass va o'zgaruvchi nomlari o'zbek tilida.

Darslik mundarijasi

  1. 1 Veb qanday ishlaydi? Brauzer manzilni kiritganingizdan sahifa ko'ringunicha nima sodir bo'ladi: mijoz-server, HTTP, DNS va HTML/CSS/JavaScrip... 7 daq.
  2. 2 Birinchi HTML sahifa Muhitni sozlash, HTML hujjat tuzilishi, teglar va atributlar, izohlar va birinchi ishlaydigan sahifa. 10 daq.
  3. 3 Matn elementlari Sarlavhalar, paragraflar, ro'yxatlar, matnni ajratish, iqtiboslar va maxsus belgilar bilan ishlash. 9 daq.
  4. 4 Havolalar va rasmlar Havola turlari, nisbiy va mutlaq yo'llar, rasm formatlari, alt atributi va media elementlari. 11 daq.
  5. 5 Jadvallar Jadval tuzilishi, thead/tbody/tfoot, katakchalarni birlashtirish, caption va jadvalning to'g'ri ishlatilishi. 9 daq.
  6. 6 Formalar Form elementi, input turlari, label, select, textarea, brauzer validatsiyasi va formalarni to'g'ri qurish. 11 daq.
  7. 7 Semantik HTML Semantik teglar, sahifa tuzilmasi, div va span, kirish imkoniyati hamda SEO uchun to'g'ri belgilash. 9 daq.
  8. 8 CSS bilan tanishuv CSS sintaksisi, uni HTML ga ulashning uch usuli, kaskad, meros va ustunlik (specificity) qoidalari. 12 daq.
  9. 9 CSS selektorlari Asosiy, birlashtiruvchi, atribut selektorlari, psevdo-klasslar va psevdo-elementlar bilan aniq elementlarni tanlash. 8 daq.
  10. 10 Ranglar va tipografiya Rang formatlari, fon va gradientlar, shrift oilalari, o'lchov birliklari va matnni formatlash xossalari. 11 daq.
  11. 11 Box model Har bir element - to'rtburchak: content, padding, border, margin. box-sizing va margin collapse muammosi. 11 daq.
  12. 12 Display va position Blok va satr elementlari, display qiymatlari, position turlari, z-index va sticky sarlavha yaratish. 10 daq.
  13. 13 Flexbox Bir o'lchamli joylashuv: flex konteyner va elementlar, tekislash, gap, wrap va amaliy shablonlar. 10 daq.
  14. 14 CSS Grid Ikki o'lchamli joylashuv: ustun va qatorlar, fr birligi, grid-template-areas va avtomatik moslashuvchan tarmoqlar. 11 daq.
  15. 15 Moslashuvchan (responsive) dizayn Mobile-first yondashuv, media so'rovlar, moslashuvchan o'lchamlar, rasmlar va mobil menyu. 10 daq.
  16. 16 CSS o'zgaruvchilari va animatsiya Custom properties, transition, transform, keyframes animatsiyalari va qorong'i rejim yaratish. 10 daq.
  17. 17 Zamonaviy CSS imkoniyatlari clamp, min, max, aspect-ratio, :has, ichma-ich CSS, konteyner so'rovlari va boshqa yangi vositalar. 10 daq.
  18. 18 Komponentlar amaliyoti BEM nomlash tizimi, CSS ni tashkil qilish va tugma, forma, kartochka, modal kabi komponentlar yaratish. 11 daq.
  19. 19 Optimallashtirish, SEO va kirish imkoniyati Sahifa tezligi, rasm optimizatsiyasi, SEO meta teglari, semantik belgilash va WCAG talablari. 12 daq.
  20. 20 Amaliy loyiha - Portfolio sayti Barcha bilimlarni birlashtirib, to'liq ishlaydigan moslashuvchan portfolio saytini noldan quramiz. 5 daq.