html dokumenta struktūra ir galvenie tagi. Pareiza HTML dokumenta struktūra un lapas kods
Labdien, emuāra lasītāji un viesi. Es atkal esmu ar jums, jūsu pazemīgais palīgs hiperteksta iezīmēšanas valodas html pamatu apguvē. Šajā rakstā es vēlos pieskarties vietņu lapu strukturēšanas tēmai un tuvāk iepazīstināt jūs ar galvenajiem valodas tagiem.
Mājas lapas struktūras tēma html ir viena no svarīgākajām un ir mājas lapas veidošanas pamats, pēc kuras apgūšanas var viegli izveidot individuālu dizainu savām lapām un mājaslapām. Lai detalizēti izpētītu tēmu, rakstā sniegts ne tikai teorētiskais materiāls, bet arī konkrēts emuāra izveides piemērs. Tagad ir pienācis laiks sākt mācīties!
Izskatās biedējoši, viegli programmējams
Tiem, kas ir īpaši nemierīgi, ievadu sākšu ar piemēru. Zemāk ir vienkāršs programmas kods, ko es uzrakstīju īpaši šim rakstam. Neuztraucieties. Katram solim tiks sniegts detalizēts skaidrojums.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 |
1. pantsŠeit ir pirmā raksta teksts. 2. pantsŠeit ir otrā panta teksts. |
Vietnes struktūras izveide, izmantojot html
- Pamata hiperteksta iezīmēšanas valodas tagi
- Jauni tagi, kas tika piegādāti kopā ar HTML 5
- Lapas strukturēšanas piemērs
1. pants
Šeit ir pirmā raksta teksts.
2. pants
Šeit ir otrā panta teksts.
Šis kods izveido emuāra lapu, kas savukārt ir sadalīta galvenē, izvēlnē, galvenajā panelī (izkārtojumā), kurā ir satura panelis (saturs) un sānjosla (sānjosla), kā arī “kājene” (footer). ).
Sāksim pārskatu no pirmās rindas.
ir valodas elements, kura galvenais uzdevums ir norādīt tīmekļa dokumenta veidu. Tādā veidā pārlūkprogramma nosaka, pēc kāda standarta lapa ir jāparāda, jo šodien ir vairākas html versijas.
Tomēr ir vērts pievērst uzmanību jaunai valodas vienībai, ko sauc stils. Kā jūs, iespējams, uzminējāt pēc nosaukuma, šis tags iestata stilu un pielāgo objektu izvietojumu lapā.
Loģiski, varu pieņemt, ka galvā uzreiz radās jautājums: “Kāds nesaprotams kods atrodas šajā programmas daļā? Tas nemaz neizskatās pēc html! Un atbilde ir šāda: stila tagā nav ierakstīts html, bet gan css kods. Kā minēts iepriekš, šis ir vietņu izskata formatēšanas rīks.
Div attiecas uz iezīmēšanas valodas bloku tagiem. To izmanto, lai izolētu noteiktus fragmentus, lai tos tālāk pārveidotu.
Bloki tiek pārvaldīti, izmantojot kaskādes stila lapas, t.i. css valoda Tīmekļa lapas piemērā ir trīs bloki, kas veidoti, izmantojot klases atribūtus.
Tādējādi kods satur:
- izkārtojums – bloks, kas atbild par lapas galveno daļu,
- sānjosla — sānjosla (parasti izveidota navigācijai),
- saturs – bloks, kurā atrodas emuāra ziņas.
Elementā ar sānjoslas klases definīciju es definēju nesakārtotu sarakstu, izmantojot elementus
- Un
- . Blokā ar stila klases saturu – virsrakstu tagi
un rindkopa
Tagad apskatīsim bloku tuvāk
.HTML vai tomēr HTML 5? Kā atpazīt?
Divā ar izkārtojuma stila klasi papildus citiem blokiem ir tādi tagi kā galvene, izvēlne un kājene. Atšķirībā no citiem elementiem piemērā, tie ir raksturīgi HTML 5 platformai.
Tādējādi galvene ir hiperteksta iezīmēšanas valodas elements, kas parasti veido vietnes lapu vai sadaļu galveni, kurās tiek ievietots virsraksts. Ir vērts atzīmēt, ka pārlūkprogramma Internet Explorer neatbalsta galveni līdz 8. versijai, bet parāda tās saturu.
Izvēlnes taga galvenais mērķis ir parādīt izvēlnes vienumus. Līdzīgi kā elementi numurētu un nenumerētu sarakstu izveidei, izvēlnes konteinerā katrs satura vienums ir iekļauts pārī savienotā tagā.
- .
Un visbeidzot, kājenes valodas vienība. Tīmekļa izstrādātāju žargonā to dažreiz sauc par lapas “kājeni”. Šis tags atrodas lapas vai sadaļu apakšā. Kājenē parasti ir informācija par konkrētā resursa autorību, dokumenta tapšanas datumu, fona informācija vai citi materiāli, kuriem nav nepieciešama īpaša tīmekļa resursa lasītāju uzmanība.
Rīki tīmekļa resursu izveidei
Interneta lapu izstrādei ir radīti daudzi programmatūras produkti. Parasti tos var iedalīt vienkāršās redaktoru programmās un profesionāli orientētos programmatūras produktos.
Veidojot vietni, pirmais, kas jāiztēlojas, ir tas, kā veidojas mājas lapa. Tas ir sava veida “pamats” vietņu veidošanā. Tāpēc, pirms iedziļināties sarežģītākās vietņu veidošanas tehnoloģijās, ieteicams iegūt vismaz pamatzināšanas par HTML. Šajā nodarbībā mēs iepazīsimies ar HTML, sakārtosim HTML dokumentu struktūra un izmantot praktiskus piemērus, lai nostiprinātu iegūtās zināšanas.
Kas ir HTML?
HTML apzīmē hiperteksta iezīmēšanas valodu. Šī valoda ir atbildīga par to, kā tieši hiperteksts tiks parādīts vietnes lapās. Tagad izdomāsim, kas ir hiperteksts? Nav noslēpums, ka vienā tīmekļa lapā var būt daudz dažādu veidu informācijas, vai tas būtu teksts, dažas tabulas, grafiki, video, audio utt. Tātad visu šo informāciju var saukt vienā vārdā - hiperteksts.
Ņemiet vērā, ka HTML ir iezīmēšanas valoda, nevis programmēšanas valoda. Šai valodai nav loģisku funkciju un tajā nav iespējams veikt nekādus matemātiskos aprēķinus. HTML lapām ir paplašinājums .html vai .htm un tos apstrādā pārlūkprogrammas - IE, Mozilla Firefox, Google Chrome, Yandex Chrome, Opera utt.
Tagad izdomāsim, kā pārlūkprogramma saprot, ko un kā parādīt tīmekļa lapā? Tas ir ļoti vienkārši. Hiperteksta iezīmēšanas valodai HTML ir iebūvētas komandas, ko sauc par tagiem. Tieši uz viņiem ir orientēta pārlūkprogramma.
HTML dokumentu struktūra
Jebkuram HTML dokumentam (tīmekļa lapai) ir jābūt noteiktai struktūrai. Tas novērsīs iespējamās problēmas, atverot lapas pārlūkprogrammās. Piemēram, apskatīsim lapu, kurā ir šāds HTML kods:
HTML dokumentu struktūra ...
- .