HTML (HyperText Markup Language) hipermətn işarələmə dilidir. İşarələmə dili İnternet səhifəsinə və ya veb saytına struktur vermək üçün istifadə olunur. İşarələmə dili dizayn daşımır, lakin strukturlaşdırma tapşırıqlarını yerinə yetirir. Struktur xüsusi elementlərdən - brauzer üçün başa düşülən etiketlərdən istifadə etməklə qurulur. Bu teqlərə tags deyilir - ingilis dilindən. sözlər tag - adlı etiket.
Hipermətn, işarələnməsi HTML dilindən istifadə edilən sənəddir. "Hipermətn" termini ilk olaraq Ted Nelson tərəfindən "özlüyündə şaxələnən və ya tələb üzrə hərəkət edən" mətnə istinad etmək üçün istifadə edilmişdir.
HTML sənədi xüsusi struktura malik adi mətn faylıdır. Açıldıqda İnternet brauzeri bu sənədi emal edir, bunun nəticəsində bizə tanış olan İnternet səhifələrini görürük, burada mətn, şəkillər, keçidlər və s. İnternet səhifələrində genişlənmə var - html.
Sadə HTML sənədinin strukturuna nəzər salaq
Sənəd
Sənəd
Sətirə tag deyilir. Ümumiyyətlə, simvollarla əhatə olunan hər şeyə tag deyilir. Bu simvollar HTML dilində xidmət simvollarıdır. İki növ etiket var:
Cütləşdi - bu teqlərin açılış və bağlanma etiketi var. Bağlama teqində slash simvolu var. Bu teqlər arasında etiketin məzmunu yazılır. Teqin məzmunu düz mətn və ya digər yuvalanmış teqlər ola bilər. Cütlənmiş etiketlərin nümunələri:
Qoşalaşdırılmamış - bağlanmayan etiketlər. Misal:
Teqlər böyük və ya kiçik hərflərlə yazıla bilər, çünki HTML yazılar arasında fərq qoymur. Siz həmişə qoşalanmış teqləri bağlamalısınız!
Çox sayda teqləri bilmək və işləyə bilmək yaxşı forma hesab olunur. Bundan qorxmaq lazım deyil, biliklərinizi praktikada tətbiq etməyə başlayan kimi hər şey yadda qalacaq və başınıza sığacaq. Növbəti təlimimiz zamanı əsas etiketlərlə tanış olacağıq. Ümumiyyətlə, HTML-də çoxlu sayda arayış kitabları artıq İnternetdə mövcuddur, burada ən son məlumatları tapa bilərsiniz, çünki tərəqqi hələ də dayanmır və proqramlaşdırma dilləri sürətlə inkişaf edir və yeniləmələr demək olar ki, çıxır. altı aydan bir. Həmçinin, təlim zamanı bizə lazım olacaq minimum etiketləri fırıldaqçı vərəqimizdə tapa bilərsiniz
HTML sənədinin strukturuna nəzər salaq:
-bu ne teqdir? Bu, bu səhifədə istifadə olunan HTML versiyasıdır. Bütün HTML sənədlərini oxşar etiketlə başlamaq adətdir. Bu gözəl əxlaq sayılır. DOCTYPE brauzerə sənədin HTML-nin hansı versiyasında yazıldığını bildirir ki, bütün brauzerlər (və indi onların çoxu var) işarələməni düzgün emal edə və sənədin məzmununu göstərə bilsin. Bu edilmədikdə, standart brauzer sənədin versiyasını səhv təyin edəcək, bunun nəticəsində bütün işarələmələr fərqli brauzerlərdə hərəkət edə və səhv göstərilə bilər. Bu halda DOCTYPE HTML5 versiyasını göstərir.
- səhifənin bütün məzmunu brauzerə bunun HTML səhifəsi olduğunu bildirən bu qoşalanmış teqlər arasındadır.
-xidmət bölməsi (başlıq), bu səhifənin görünüşü, çıxışı və işindən məsul olan xarici faylları və parametrləri birləşdirmək üçün istifadə olunur. Başlıq etiketi istisna olmaqla, onun məzmunu çox vaxt səhifədə göstərilmir. başlıq etiketi – tabda göstərilən səhifənin başlığını ehtiva edir.
— səhifədə göstərilən hər şey bədən etiketində yazılır.
HTML-in funksional imkanlarını genişləndirmək üçün etiketlərə atributlar adlanan xüsusi məlumat əlavə edilir. Beləliklə, xəttdə:
charset="UTF-8" - atribut. Bir çox atribut ola bilər. Atributlar boşluqlarla ayrılaraq yazılır. Bu halda, meta HTML teqindən istifadə edərək, UTF-8 kodlaşdırması səhifədə müəyyən edilir. Bunlar. Səhifənin məzmununu düzgün göstərmək üçün brauzerə bu sənədin kodlaşdırılması deyilir.
Atributlar teqlərin funksionallığını genişləndirmək üçün istifadə olunur və həm teqlərin səhifədə göstərilmə tərzini, həm də onların davranışını dəyişməyə imkan verir. Bütün teqlər məlumatı göstərmək üçün istifadə edilmir, məsələn, JavaScript-dən istifadə etməklə, yalnız səhifənin davranışını proqramlaşdırmaq üçün istifadə olunan teqlər var;
Etiketlər nədir? Onlar atributlardan nə ilə fərqlənir?
HTML səhifəsində hansı teqlər olmalıdır?
Dərsin mətni Kamenschik M ilə birlikdə hazırlanmışdır.
Teq bucaqlı mötərizədə (məsələn, ) alınmış xüsusi qorunan sözdür. Teq HTML-nin əsas komponentidir: kod onunla başlayır, onunla bitir və veb-səhifədə göstərilən məlumat teqlərin içərisindədir. Onları kiçik hərflərlə, yəni adi kiçik hərflərlə yazmaq tövsiyə olunur: yox, amma.
Etiketlərin hansı növləri var?
Əksər HTML teqləri qoşalaşdırılır: açılış teqi (məsələn, ) və bağlanma teqi var ki, o açılış teqindən birinci bucaq mötərizəsindən sonra slash (/) ilə fərqlənir (məsələn, ). Bir cüt etiketin içərisində olan hər şey onların məzmunu adlanır.
Məzmun Bu teqlərin içərisinə yerləşdirilən mətn qalın olur
Cütləşməmiş (tək) teqlər də var ki, onlara tag deyilir. Onlar, qoşalaşmış etiketlərdən fərqli olaraq, bağlanmağa ehtiyac duymurlar, çünki məzmunla işləmirlər, lakin özləri bəzi funksiyaları yerinə yetirirlər. Tək etiket nümunəsi - . O, mətni növbəti sətirə bükmək üçün təyin edir.
Rus dili ilə paralellər aparsaq, deyə bilərik ki, qoşalaşmış teqlər onlarda olan mətnin xassələrinə təsir edən dırnaq və ya mötərizədir (dırnaqları vaxtında bağlamamağa çalışın), tək teqlər (işarələr) isə durğu işarələridir ( nida, sual və ya nöqtə).
Hər hansı bir etiket aşağıdakılardan ibarətdir:
Açıq bucaq mötərizəsi (<
).
Xüsusi söz (etiket adı). Məsələn, hr , iframe , b .
Bağlama bucağı mötərizəsi (> ).
Əsas HTML Teqləri
Etiketlər işarələmə dilinin əsasını təşkil etdiyindən, onların kifayət qədər çox olması təəccüblü deyil. Əsas, ən vacib etiketlərə baxaq.
- şərhi olan tək etiket. Şərh brauzer tərəfindən emal olunmayan mətndir. Teqin içərisinə istədiyinizi yaza bilərsiniz, hətta başqa teqlər belə - işləməyəcək, ekranda görünməyəcək. Tərtibatçılar ya digər veb-masterlərin onu başa düşmələrini asanlaşdırmaq üçün, ya da uzun müddətdən sonra onu tez başa düşə bilmələri üçün koda şərh verirlər.
, , , , hər hansı bir layiqli HTML sənədində mövcud olan teqlərdir (ətraflı məlumat üçün “Notepad-da veb-sayt necə yaradılmalı” bölməsinə baxın).
- etiketdə brauzerlər və axtarış sistemləri üçün köməkçi məlumatlar var. Onun içərisində açar sözlər, səhifənin təsviri, sənədin kodlaşdırılması, müəllifin adı və s.
skript faylına və ya kodun özünə keçid ehtiva edir.
- CSS-dən istifadə edərək sənədin və/və ya onun elementlərinin üslubunu təyin edən etiket. HTML sənədində səhifənin müxtəlif hissələri üçün müxtəlif üslubları müəyyən edən çoxlu teqlər ola bilər.
- tam əksi, onu tamamlayan. Teq bölmənin və ya bütün səhifənin “başlığını” (başlığını) təyin edir.
saytın və ya bölmənin “ayaqlarını” saxlayır. Onun içərisində siz dəstəkləyici məlumatları, müəllif hüquqları, əlaqə məlumatları və s. yerləşdirə bilərsiniz.
səhifənin əsas məzmununu ehtiva edir. Nə başlıq, nə menyu bloku, nə də saytın "ayaqları" deyil, səhifənin nə üçün yaradıldığı. Məsələn, indi oxuduğunuz səhifədə bu məqalə içəridə yerləşməlidir.
veb səhifəyə şəkillər əlavə etmək üçün lazımdır (sizin xidmətinizdə bu fəaliyyətə həsr olunub).
,
, -
,
,
,
, , , və digər mətn formatlama teqləri HTML teqlərinin böyük bir qrupunu təşkil edir, onlar “HTML-də mətnin formatlaşdırılması” məqaləsində müzakirə olunur;
- blok elementi. İçindəki mətn CSS (təlimliyin ikinci hissəsinin mövzusu olan kaskad üslub cədvəlləri) istifadə edərək formatlanır.
. Bir abzasınız var
və ya blok. İçindəki mətn eyni üslubda hazırlanmışdır, lakin siz strukturu pozmadan bir neçə sözün fərqli şrift ölçüsü və ya rənginə malik olduğundan əmin olmaq istərdiniz. Etiket məhz belə hallar üçün nəzərdə tutulub.
,
,
- siyahı etiketləri. İşarələnmiş, nömrələnmiş - bu etiketlərin işi. Teqlərin cavabdeh olduğu təriflərin siyahıları da var, lakin siz "Siyahıların yaradılması" məqaləsində bunların altısı haqqında ətraflı məlumat əldə edəcəksiniz.
,
,
,
, Və
cədvəllər yaratarkən istifadə olunur və ayrıca məqalədə ətraflı müzakirə olunur.
- səhifəyə interaktivlik əlavə edən, yəni istifadəçiyə veb-saytla qarşılıqlı əlaqə yaratmağa imkan verən etiket. Təbii ki, formaya işləyici lazımdır, lakin daxilindəki teqlərin köməyi ilə siz interfeys yarada bilərsiniz. Yoxlama qutuları, düymələr, radio düymələri, daxiletmə sahələri və sizdən aktiv hərəkətlər tələb edən digər obyektlərin hamısı kodu konteynerin içərisinə yerləşdirilən forma elementləridir.
- interaktiv düymə yaradan etiket. Üzərinə kliklədiyiniz zaman nəyinsə baş verməsi üçün düymə formada olmalıdır (teqlər arasında yerləşir).
forma elementlərini yaradır: açarlar, onay qutuları, düymələr, bütün növ daxiletmə sahələri. Bir konteynerə daxil edilir. Bəs universalı varsa, ayrı-ayrılara niyə ehtiyacımız var? qabaqcıl parametrləri olan düymə yaratmağa imkan verir. Məsələn, bir düyməyə şəkil yerləşdirə bilərsiniz. vasitəsilə yaradılan elementdə bunu etmək olmaz.
və - HTML 5-də menyu yaratma teqləri. - bu, içərisində elementlərin yerləşdirildiyi konteynerdir, əlavə edilməsi menyu elementlərinin yaradılmasına gətirib çıxarır. Çox maraqlı cütlük. Məsələn, onun köməyi ilə bir səhifə və ya onun fərdi elementi üçün öz kontekst menyusunu yarada bilərsiniz.
- yalnız bir mətn sətrini deyil, bütün paraqrafları daxil edə biləcəyiniz böyük bir sahə yaradan başqa bir forma etiketi.
HTML teqləri HTML dilinin əsasını təşkil edir. Teqlər işarələmədə elementlərin başlanğıcını və sonunu məhdudlaşdırmaq üçün istifadə olunur.
Hər bir HTML sənədi HTML elementləri və mətn ağacından ibarətdir. Hər bir HTML elementi başlanğıc (açma) və bitmə (bağlama) teqi ilə müəyyən edilir. Açılış və bağlanma teqlərində etiketin adı var.
Bütün HTML elementləri beş növə bölünür:
boş elementlər - , , , , , , , ,
Səhifə haqqında əlavə məlumat saxlamaq üçün istifadə olunur. Bu məlumat brauzerlər tərəfindən səhifəni emal etmək üçün, axtarış sistemləri isə onu indeksləşdirmək üçün istifadə olunur. Bir blokda bir neçə teq ola bilər, çünki istifadə olunan atributlardan asılı olaraq onlar müxtəlif məlumat daşıyırlar.
Verilmiş diapazonda ölçmə göstəricisi.
Sayt üçün naviqasiya keçidlərini ehtiva edən sənədin bölməsi.
Skripti dəstəkləməyən bölməni müəyyənləşdirir.
Multimedia yerləşdirmək üçün konteyner (məsələn, audio, video, Java proqramları, ActiveX, PDF və Flash). Siz həmçinin cari HTML sənədinə başqa veb səhifə əlavə edə bilərsiniz. Etiket plaqinin parametrlərini ötürmək üçün istifadə olunur.
Sıralı nömrələnmiş siyahı. Nömrələmə rəqəmli və ya əlifba sırası ilə ola bilər.
Bir qrup element üçün başlığı olan konteyner.
, və ya , açılan siyahıdan seçmək üçün seçim/seçim müəyyən edir.
Skriptdən istifadə edərək hesablanmış hesablamanın nəticəsini göstərmək üçün sahə.
Mətndə paraqraflar.
Elementdən istifadə edərək daxil edilmiş plaginlər üçün parametrləri müəyyənləşdirir.
Bir elementdən ibarət konteyner elementi və sıfır və ya daha çox element. Özü heç nə göstərmir. Brauzerə ən uyğun şəkli seçməyə imkan verir.
Mətni formatlaşdırmadan, boşluqları və mətn fasilələrini qoruyur. Kompüter kodunu, e-poçt mesajlarını və s. göstərmək üçün istifadə edilə bilər.
İstənilən növ tapşırığın tamamlanmasının göstəricisi.
Qısa sitat müəyyən edir.
Şərqi Asiya simvolları və onların dekodlanması üçün konteyner.
Daxili mətni annotasiyanın əsas komponenti kimi müəyyən edir.
Daha kiçik şriftdə göstərilən elementdə olan simvolların üstündə və ya altında qısa təsvir əlavə edir.
Daxili mətni əlavə annotasiya kimi qeyd edir.
Brauzer elementi dəstəkləmirsə, alternativ mətni göstərir.
Cari olmayan mətni üstü üstü xəttlə göstərir.
Proqram kodunun və ya skriptin icrasının nəticəsini əks etdirən mətni, həmçinin sistem mesajlarını göstərmək üçün istifadə olunur. Monospace şriftində göstərilir.
Müştəri tərəfi skripti müəyyən etmək üçün istifadə olunur (adətən JavaScript). skript mətni və ya src atributundan istifadə edərək xarici skript faylına işarələr ehtiva edir.
Səhifənin məntiqi sahəsini (bölməsini) adətən başlıq ilə müəyyən edir.
Təklif olunan dəstdən dəyərləri seçməyə imkan verən nəzarət elementi. Variant dəyərlər yerləşdirilir.
Mətni daha kiçik şrift ölçüsündə göstərir.
, , üçün alternativ media resurslarının yerini və növünü müəyyən edir.
Daxili elementlər üçün konteyner. Fərdi sözləri rənglə vurğulamaq kimi mətn keçidlərini formatlamaq üçün istifadə edilə bilər.
Mətndə vurğu yerləşdirin, onu qalın hərflərlə vurğulayın.
Daxil edilə bilən stil cədvəlləri daxildir.
Simvolların, məsələn, kimyəvi düsturlardakı element indeksinin alt yazı yazısını təyin edir.
Teq üçün görünən başlıq yaradır. Doldurulmuş üçbucaqla göstərilir, üzərinə klikləməklə başlıq təfərrüatlarına baxmaq imkanı verir.
Simvolların yuxarı yazısını təyin edir.
Cədvəl yaratmaq üçün etiket.
Cədvəlin gövdəsini müəyyənləşdirir.
Cədvəl xanası yaradır.
Skript vasitəsilə klonlaşdırıla və sənədə daxil edilə bilən HTML kod fraqmentlərini elan etmək üçün istifadə olunur. Bir etiketin məzmunu onun övladı deyil.
Böyük mətn daxiletmə sahələri yaradır.
Cədvəl altbilgisini müəyyən edir.
Cədvəl xanasının başlığını yaradır.
Cədvəl başlığını müəyyənləşdirir.
Tarix/saat müəyyən edir.
Brauzerin başlıq çubuğunun yuxarısında görünən HTML sənədinin başlığı. Axtarış nəticələrində də görünə bilər, ona görə də başlıq təqdim edərkən bu nəzərə alınmalıdır.
Cədvəl sırası yaradır.
Elementlər və üçün altyazılar əlavə edir.
Əlavə vurğu olmadan mətnin bir hissəsini vurğulayır.
Səhifəyə video faylları əlavə edir. 3 video formatını dəstəkləyir: MP4, WebM, Ogg.
Brauzerə uzun xəttin kəsilə biləcəyi yeri göstərir.
Etiketləri olan fırıldaqçı vərəq
İstifadə rahatlığı üçün hər bir teq üçün ekran xassə dəyərləri əlavə edərək tematik bölmələrə qruplaşdırdım. Masaya getmək üçün şəklin üzərinə klikləyin.
- sənədin gövdəsinin başlanğıcı, qoşalaşmış teq - bu teqdən sonra gələn hər şey ekranda görünəcək.
- paraqrafın əvvəli (həmişə yeni sətirdən başlayır), qoşalaşmış etiket - hizalanma parametri ola bilər. Misal üçün:
- paraqrafın bütün sətirlərini sol kənarına basın (standart olaraq istifadə olunur).
- paraqrafın bütün sətirlərini sağ kənarına basın.
- paraqrafın bütün sətirlərini səhifədə mərkəzləşdirin.
- paraqrafın bütün sətirlərini səhifənin eninə uyğunlaşdırın.
- növbəti paraqraf başlayırsa və ya sətir kəsilməsinə səbəb olacaq yeni teq varsa, paraqrafın sonundakı bağlanış teqi olmaya bilər.
- güclü vurğulanmış şrift, qoşalaşmış etiket. MƏTN VURĞULANAN MƏTN
- bağlanma teqi güclü vurğulanmış şriftin sonudur.
- seçilmiş şrift, qoşalaşmış etiket. MƏTN SEÇİLMİŞ MƏTN
- bağlanma teqi seçilmiş şriftin sonudur.
- əvvəlcədən formatlaşdırılmış mətn (makina şrifti), qoşalaşmış etiket. O, həmişə yeni sətirdən başlayır və ekranda onun yazıldığı formada göstərilir (“boşluqların” sayı sizin yazdığınızdır). MƏTN
- məcburi xətt fasiləsi, qoşalaşdırılmamış etiket - yeni sətirə keçid.
- üfüqi xətt, qoşalaşdırılmamış komanda - üfüqi xətt daxil edir, sətirdən əvvəl və sonra yeni xəttə keçid olur. Parametrləri ehtiva edə bilər. Məsələn: - qalınlığı 1 olan üfüqi xətt (standart olaraq istifadə olunur). - qalınlığın üfüqi xətti 2.
- şrift ölçüsü 1 (maksimum), qoşalanmış teq. Bu halda mətndən əvvəl və sonra sətir kəsilməsi baş verir.
- bağlanan etiketin sonu şrift ölçüsü 1.
Şrift Ölçüsü 1
Şrift Ölçüsü 2
Şrift Ölçüsü 3
Şrift Ölçüsü 4
Şrift Ölçüsü 5
Şrift Ölçüsü 6
- səhifənin mərkəzindəki mətni cırmaq, pis etiket.
- terminlər və təriflər siyahısının başlanğıcı, qoşalaşmış etiket. Təriflər - terminlər və təriflər siyahısının adını göstərin - termin elementinin başlanğıcı, qoşalaşmış etiket. - bağlanma teqi, element müddətinin sonu. - element tərifinin başlanğıcı, qoşalaşmış etiket. - bağlanma teqi, element tərifinin sonu.
- bağlanış etiketi terminlər və təriflər siyahısının sonu.
Termin və təriflərin nümunə siyahısı:
Təriflər Kompyuter elmləri
Kompüter
BIT
Fayl
Təriflər Kompyuter elmləriİnformasiya ilə işləməyin bütün aspektlərini öyrənən elm Kompüter Məlumatla işləmək üçün universal vasitədir BIT Minimum və bölünməz informasiya vahidi Fayl Saxlama mühitində yerləşən adlanmış məlumatlar
- qrafik obyekt, qoşalaşdırılmamış komanda. Görünüş parametrlərdən istifadə etməklə müəyyən edilir. Bəzi parametrlər: SRC="file" - qrafik faylın yerini və adını müəyyən edir (əgər fayl sənədlə eyni kataloqdadırsa, o zaman ad kifayətdir). WIDTH="en" - şəkil üçün ayrılmış eni təyin edir (faizlə ifadə edilə bilər). HEIGHT="hündürlük" - şəkil üçün ayrılmış hündürlüyü təyin edir (faizlə ola bilər). HSPACE="width" - təsvirin yan tərəflərində sahənin enini təyin edir. VSPACE="height" - təsvirin yuxarı və aşağı hissəsindən sahənin hündürlüyünü təyin edir. BORDER="width" - şəkil sahəsi ətrafında haşiyə zolağının enini təyin edir. ALT="mətn"
- задает текст, который будет вывкден в поле картинки, если (пока) она отсутствует.
!} TITLE="mətn"
- задает текст, который появиться при наведении курсора мыши на поле картинки.!}
Qeyd.
Hər hansı bir parametr olmaya bilər.
Parametr aktivdirsə, o, etiketin içərisində olmalıdır.
- cədvəlin başlanğıcı, qoşalaşmış etiket. Cədvəl görünüşü aşağıdakı parametrlərdən istifadə etməklə təyin edilə bilər: BORDER="nömrə" - cədvəl hüceyrələrinin ətrafındakı haşiyənin qalınlığını göstərir.
Cütlənmiş teqlərdən ibarət HTML elementləri ya hər hansı digər elementləri ehtiva edə bilər, ya da özləri başqa elementlər içərisində yuvalana bilər və elementlərin yuvalanma dərinliyi məhdud deyil.
Aşağıdakı nümunə ikisi iç-içə olan üç elementdən ibarətdir:
İlk abzasım
Bir element digərinin içərisinə yerləşdirildikdə, iç-içə elementin eyni elementdə başlayıb, bitməsinə əmin olmalısınız. Beləliklə, məsələn, aşağıdakı kod səhvdir:
Bu çox
Maraqlıdır
Burada element elementin hüdudlarından kənara çıxır
Düzgün yerləşdirmə nümunəsi:
Çox maraqlıdır
Burada element düzgün şəkildə yerləşdirilib - o, tamamilə elementin daxilindədir
Boşluq simvolları
Brauzer HTML kodundakı boşluq simvollarına məhəl qoymur, beləliklə kodunuzu daha oxunaqlı etmək üçün onlardan öz xeyrinizə istifadə edə bilərsiniz. Boşluq simvollarına nişanlar, sətir fasilələri və istənilən miqdarda istifadə edilə bilən müntəzəm boşluqlar daxildir; Boşluqdan istifadə edən kod nümunəsi:
Başlıq Mənim ilk başlığım
İlk abzasım
Nümunə kodu ümumiyyətlə boşluqdan istifadə etmədən yazıla bilər, lakin belə kod daha az oxuna bilər:
BaşlıqMənim ilk başlığım
İlk abzasım
HTML sənəd kodu zaman keçdikcə böyüdükcə və mürəkkəbləşdikcə, boşluqdan istifadənin kodun oxunuşunu yaxşılaşdırdığını görəcəksiniz.
