HTML və CSS
Veb səhifələrin quruluşu və dizaynı
Veb-səhifələri sıfırdan qurmağı öyrən: vebin necə işlədiyini başa düş, HTML ilə mətni, siyahıları, cədvəlləri, keçidləri, şəkilləri və formaları düzgün qur, semantik elementlərlə səhifəni hamı üçün əlçatan et. Sonra CSS ilə ona gözəl görünüş ver: selektorlar, kaskad, qutu modeli, Flexbox, Grid, adaptiv dizayn, animasiyalar və dəyişənlər. Bütün nümunələr brauzerdə canlı işləyir, ona görə hər dəyişikliyin nəticəsini dərhal görəcəksən.
Kursun məzmunu
HTML əsasları
BaşlanğıcVebin necə işlədiyini öyrən və mətn, siyahı, cədvəl, keçid və şəkillərdən ibarət ilk səhifələrini yaz.
- 1Veb necə işləyir: ilk HTML səhifənSaytı açanda nə baş verdiyini öyrən və teqlər, elementlər və atributlardan ibarət ilk HTML səhifəni yaz.15 dəq
- 2Mətn, siyahılar və cədvəllərMətni başlıqlar və abzaslarla qur, vacib olanı vurğula, məlumatı siyahılara və cədvəllərə düz.18 dəq
- 3Keçidlər və şəkillərSəhifələri keçidlərlə birləşdir, səhifə daxilində hərəkət et və mənalı alternativ mətni olan şəkillər əlavə et.16 dəq
Formalar və semantik HTML
Başlanğıcİstifadəçidən məlumat alan formalar qur və səhifəni həm insanlar, həm də ekran oxuyucuları üçün aydın et.
- 4Formalar və daxiletmə sahələriNişanları, düzgün sahə növləri və məlumatı göndərməzdən əvvəl yoxlayan daxili yoxlaması olan formalar qur.18 dəq
- 5Semantik HTML və əlçatanlıqMəzmunun mənasını bildirən elementlərdən istifadə et və səhifəni hamı, o cümlədən ekran oxuyucusu istifadəçiləri üçün rahat et.16 dəq
CSS-in əsasları
OrtaSelektorlar, rənglər, şriftlər, kaskad və qutu modeli ilə səhifənin görünüşünü idarə et.
- 6CSS əsasları: selektorlar, rənglər, şriftlər və kaskadCSS qaydalarının necə yazıldığını öyrən, elementləri selektorlarla seç, rəng, ölçü vahidi və şrift ver və qaydalar toqquşanda hansının qalib gəldiyini başa düş.22 dəq
- 7Qutu modeliHər elementin məzmun, daxili boşluq, haşiyə və xarici boşluqdan ibarət qutu olduğunu öyrən, ölçüləri düzgün hesabla və `box-sizing` ilə işi asanlaşdır.18 dəq
Səhifə düzülüşü və müasir CSS
İrəliFlexbox və Grid ilə istənilən ekrana uyğunlaşan səhifələr qur, keçid effektləri, animasiyalar və CSS dəyişənləri ilə onları canlandır.
- 8Flexbox: elementləri bir xətt boyunca düzməkFlexbox ilə elementləri sətir və ya sütun şəklində düz, aralarındakı boşluğu payla, onları mərkəzə gətir və mövcud yerə uyğunlaşdır.20 dəq
- 9CSS Grid və adaptiv dizaynCSS Grid ilə sətir və sütunlardan ibarət səhifə maketləri qur, media sorğuları və «əvvəlcə mobil» yanaşması ilə onları istənilən ekrana uyğunlaşdır.22 dəq
- 10Keçidlər, animasiyalar və CSS dəyişənləriRəngləri və ölçüləri CSS dəyişənlərində saxla, hamar keçid effektləri və `@keyframes` animasiyaları ilə səhifəni canlandır — hərəkətə həssas istifadəçiləri unutmadan.20 dəq