Žymos reikalingos kuriant HTML. Pagrindinės HTML žymės. Tušti blokiniai ir įterptieji konteineriai

Svetainės kūrimas šiais laikais ypatingų sunkumų nesukels, nes internete yra pakankamai portalų, siūlančių savo paslaugas kuriant svetainę. Bet tokiai paslaugai sukurta svetainė yra ne jos pačios kūrinys, o mėgintuvėlyje užauginto klono panašumas.

Savarankiškai sukurta svetainė visada bus mylimas vaikas, iškentęs džiaugsmingą kūrybos agoniją. Galite sukurti svetainę naudodami HTML programavimo kalbą, vadinamąją statinę svetainę.

Svetainei sukurti naudojamas HTML redaktorius. Norint savarankiškai sukurti svetainę HTML pagrindu, reikia HTML programavimo kalbos žinių, tam tikrų Photoshop sąvokų, tam tikrų straipsnių rašymo įgūdžių, šiek tiek vaizduotės ir dizaino meno.

Svetainė, sukurta naudojant PHP programavimo kalbą, yra dinamiška svetainė. Dauguma egzistuojančių interneto svetainių yra sukurtos remiantis PHP, CMS (turinio valdymo sistemos) varikliais. Šioje svetainėje galite sužinoti, kaip sukurti svetainę ir gauti kvalifikuotos pagalbos kuriant svetainę patiems naudojant TVS variklius:
- svetainės kūrimas Joomla;

Pradėti ką nors daryti visada sunku. Čia svarbiausia išsikelti konkretų tikslą. Norėdami pradėti, pasirinkite svetainės, kurią norite sukurti, temą ir pavyzdį bei parengite jos įgyvendinimo planą. Ir judėkite pagrindinio tikslo pasiekimo keliu.

Kaip ir hiperteksto žymėjimo kalba. HTML nėra programavimo kalba, tai svetainės žymėjimo kalba.

Visos naršyklės gali konvertuoti šį žymėjimą į vartotojui patogų formatą.

Šioje kalboje naudojamos specialios komandos, vadinamos žymomis. Kiekviena žyma turi savo funkciją. Yra labai daug etikečių. Idealiu atveju reikia visko išmokti. Tačiau pradedančiajam kūrėjui pakanka pagrindinių žinių.

Pagrindinės HTML komandos

HTML komandų sąrašas yra labai didelis. Tačiau pagrindinių nėra daug. Norėdami pradėti rašyti kodą, jums reikia redaktoriaus. Galite naudoti Notepad. Rekomenduojama naudoti Notepad++. Jis atrodo taip.

Privalumas yra tas, kad specialiuose redaktoriuose žymos yra paryškintos tam tikra spalva, priklausomai nuo kategorijos. Komandos, skirtos sukurti HTML svetainę Notepad ar bet kurioje kitoje programoje, yra tokios pačios. Visur vartojama ta pati kalba. Kūrimo aplinka yra tik įrankis.

HTML turi uždarymo ir neuždarymo žymas. Taip pat šioje kalboje yra lizdo sąvoka. Kiekvienas kode esantis objektas yra elementas. Elementas turi pradinę, uždarymo žymą ir turinį. Be to, žyma turi savo papildomų atributų su savo vertėmis.

Paveiksle matote dvi žymas ir . Atminkite, kad atidarymas ir uždarymas rašomi vienodai, tačiau skiriasi tik „/“. Jei žyma neuždaryta, tvarkytojas visa kita laikys šio konkretaus elemento tęsiniu. Tai labai svarbu. Ypač nuorodose. Mes pažvelgsime į juos šiek tiek toliau.

Žyma yra būtina. Visada reikia rašyti. Tačiau jo uždaryti nereikia. Pagal standartus tai būtina, bet jei neuždarysite, jis vis tiek veiks.

Šios HTML komandos yra puslapio struktūra. Jie yra privalomi. Jie taip pat užsidaro.

Žymų pavadinimas atitinka reikšmę. Galva - galva. Šiame skyriuje nurodoma paslauga ir svarbi nematoma informacija. Turinio dalis yra dokumento dalis. Čia yra turinys, kuris rodomas vartotojui. Stenkitės nedelsdami uždaryti žymas, kad vėliau nekiltų painiavos.

Paslaugos skyriuje rašoma:

  • dokumento pavadinimas;
  • stiliaus failai;
  • scenarijaus failai;
  • meta žymeles;
  • instrukcijos paieškos sistemoms;
  • instrukcijos robotams;
  • bet kokia kita informacija, kuria gali naudotis programuotojai, bet ne vartotojai.

Stiliaus failas prijungtas taip:

Scenarijaus failas yra toks:

Tekstas turi turėti pavadinimą. Mes tai nurodome taip:

Puslapio pavadinimas

Šis tekstas bus rodomas naršyklės skirtuko pavadinime. Šis pavadinimas taip pat rodomas kaip paieškos variklio rezultatų rezultatas.

Žymos teksto formatavimui

Tekstas turi būti įdėtas į pastraipos žymą. Jis žymimas kaip. Tekstui taip pat galite naudoti eilutę.

Galite formatuoti tekstą kaip Word:

  • kursyvas
  • paryškintas tekstas
  • perbrauktas tekstas
  • pabrauktas tekstas

Tekstas gali būti stilizuotas. Juos apžvelgsime pabaigoje, peržiūrėję kitus elementus.

Antraštės naudojimas

Yra ir kitų svarbių HTML komandų. Norint sukurti svetaines, reikalingos antraštės. Jie nurodomi naudojant pirmojo lygio antraštės žymą. Yra lygiai nuo 1 iki 6. Svarbu suprasti, kad antraštės turi būti įdėtos.

Pavyzdys paveikslėlyje.

Nepamirškite, kad rekomenduojama naudoti tik vieną h1 antraštę. Tokiu atveju jis turi atitikti žymą. Žinoma, galite nurodyti 200 h1 antraščių, bet tada būsite nubausti paieškos sistemų.

Vaizdų naudojimas

Vaizdai yra neatsiejama interneto puslapių dalis. Pavyzdyje parodyta, kaip galite įterpti nuotrauką.

Kaip matote, pavyzdyje išsamiai parodyta, kas ir kaip vadinama.

Nuorodų naudojimas

Jei mokate HTML komandas, tiesiog turite žinoti nuorodos žymą. Tai vienas iš svarbiausių sudedamųjų dalių

Aukščiau pateiktame pavyzdyje matote, kad vietoj nuorodos teksto yra vaizdas. Tai yra, galite įdėti ir tekstą, ir paveikslėlį.

Naudojant lenteles

Lentelės taip pat naudojamos labai dažnai. Iš pradžių jie turėjo pateikti informaciją patogia forma. Tačiau vėliau maketuotojai jais išdėstė įvairius puslapio elementus.

Lentelė sudaroma taip:

Langelio tekstas Langelio tekstas
Langelio tekstas Langelio tekstas

Atributas width nurodo lentelės plotį. Jis gali būti išreikštas procentais arba pikseliais. Border nurodo kraštinės storį.

Struktūra nurodyta taip. „tr“ žyma yra eilutė. Pažymėkite td langelį. Ir visi kartu - tai yra stalas.

Lentelė gali būti lygiuojama. Norėdami tai padaryti, naudokite lygiavimo atributą, kuris gali turėti tris reikšmes: Left, Center, Right. Naudojimo pavyzdys pateiktas žemiau.

Šios HTML komandos (plotis ir lygiavimas) tinka ir kitiems elementams. Vaizdams taip pat nurodomas rėmelio storis.

Sąrašų naudojimas

Naudodami HTML komandas galite kurti įvairių tipų sąrašus. Beveik lygiai taip pat, kaip ir Word redaktoriuje.

HTML kalboje yra tokio sąrašo surikiuoti ir nerūšiuoti pavyzdžiai.

  • Pirma
  • Antra
  • Trečia

Rezultatas bus toks:

  • Pirma
  • Antra
  • Trečia

Sąrašo tipas

HTML kodas

Apskritimo pavidalu

Apskritimo pavidalu

Su kvadratiniais žymekliais

Sutvarkyti sąrašai sukuriami lygiai taip pat, bet vietoj

    , naudokite žymą.

    Čia taip pat galite nustatyti sąrašo rodymo tipą:

    • "1" - Arabiški skaičiai 1, 2, 3...
    • "A"- didžiosios raidės A, B, C...
    • "a"- mažosios raidės a, b, c...
    • "aš"- dideli romėniški skaitmenys I, II, III...
    • "aš"- maži romėniški skaitmenys i, ii, iii...

    Standartiškai rodomi arabiški skaitmenys.

    Kadangi tai yra sunumeruoti sąrašai, jie turi pradžios atributą, nurodantį pradinę sąrašo reikšmę. Pavyzdžiui, galite rodyti sąrašą pradedant nuo 10 ar 20 d.

    Stilių naudojimas

    Svetainės HTML komandos yra gana įvairios, tačiau visos jos atitinka stilius. Stilius galima nurodyti kaip failą antraštėje: skyriuje arba galite iš karto parašyti paruoštą stilių.

    Atminkite, kad šie stiliaus apibrėžimai skiriasi. Stiliaus failą galima nurodyti visuose svetainės puslapiuose. Kai tik atliksite pakeitimus, šis naujinimas paveiks visą svetainę. Jei konkrečiame puslapyje nurodysite stilius, šių klasių pakeitimai ir naudojimas bus tik šiame faile. Jūsų nustatymai neviršys to.

    Įsivaizduokite, kad turite 20 HTML puslapių ir nusprendėte antraštę padaryti 2 pikseliais didesnę. Jei stilių faile turite viską, turėsite atlikti tik pakeitimus. Jei viskas individualu, teks atnaujinti visus 20 puslapių.

    Galite nurodyti tik vienam puslapiui taip.

    Dabar keli žodžiai apie žymas, kurias naudojome kurdami šį puslapį.

    html žymų aprašymas iš pavyzdžio

    1. – šios žymos turi būti kiekviename tinklalapyje. Jie nurodo naršyklėms ir paieškos sistemoms, kad tai yra HTML puslapis.

    Bet kuris html puslapis turi tokią struktūrą:

    ... Antraštės žymos ... ... Puslapio tekstas ...

    2. - tarp šių žymų yra visas matomas puslapio turinys.

    4. - tarp šių žymų rašomas puslapio pavadinimas, kuris rodomas pačiame naršyklės viršuje. Beje, kai ko nors ieškai paieškos sistemose, pirmiausia rodomas puslapio pavadinimas. Žyma dažnai sutrumpinama iki „pavadinimas“. Patariu perskaityti straipsnį: kaip sukurti žymą

    Dabar pereikime prie žymų, esančių html puslapio turinyje (viduje ir ).

    5. – šios žymos sutelkia viską jose. Šiuo atveju centras bus ekrano centras. Ateityje rekomenduojama nebenaudoti šių žymų.

    6. yra viena iš pavadinimo žymų klasės..., dažniausiai pridedanti puslapio pavadinimą. Pavyzdžiui, šiame puslapyje yra pavadinimo žyma „HTML puslapio kūrimo pavyzdys“.

    Pastaba

    Šios žymos turi daug svarbos nustatant svetainės reitingą, todėl jas reikia naudoti atsargiai ir išmintingai.

    Kurdami html kodą, turite laikytis paprastos taisyklės: antraštės žyma turi būti pirmiausia, o tada ji gali ateiti ir pan. Svarbiausia, kad nebūtų pirma, paskui, paskui ir pan. Turi būti griežta hierarchija. Antraštės ir kt. gal daug.

    7.
    yra viena žyma, kuriai nereikia baigiamosios žymos. Jis pereina į kitą eilutę. Savo pavyzdyje parašiau dvi atskiras žymas iš eilės, kad du kartus peršokčiau į kitą eilutę.

    8. yra viena žyma, rodanti vaizdą.

    • src yra būtinas parametras, nurodantis vaizdo adresą (vietoj URL_IMAGE turite įvesti adresą, kuriame saugomas vaizdas).
      Pastaba:
      • Jei vaizdas yra tame pačiame aplanke kaip ir jūsų html puslapis, tuomet pakanka parašyti paveikslėlio pavadinimą, kitu atveju reikia įvesti arba absoliutų, arba santykinį URL;
      • Nepamirškite nurodyti vaizdo plėtinio. Pavyzdžiui, .jpg, .gif, .jpeg.
    • alt arba title – šiuose parametruose galite parašyti savo vaizdo aprašymą. Užvedus pelės žymeklį virš vaizdo, pasirodys šis aprašymas. Šie parametrai svarbūs reklamuojant svetainę, ypač vaizdų paieškoje. Jei vaizdo įkelti nepavyko, šis tekstas bus rodomas, o tai taip pat yra pliusas.

    9. – šios žymos sukurtos šriftui, fonui, dydžiui ir kt. keisti. Trumpai tariant, viską, kas susiję su teksto formatavimu, galima sukonfigūruoti vienoje žymoje. Ši žyma turi nemažai atributų, kuriuos aptarsiu atskiroje pamokoje.

    Pastaba: - panaši žyma.

    Taip pat yra CSS šrifto ypatybė, kurioje galite nustatyti visas šias parinktis.

    10. – paryškinti paryškintu šriftu. Viskas tarp ir bus paryškinta pusjuodžiu šriftu. Pavyzdžiui, jei parašysite pačioje turinio pradžioje ir uždarysite pačioje pabaigoje, visas tekstas puslapyje bus paryškintas paryškintu šriftu. Tai gana dažna žyma, kurios analogas yra .

    Paieškos sistemos atkreipia dėmesį į šią žymą didindamos raktinių žodžių įtaką. Tačiau reikia būti atsargiems, nes kiekvieną kartą paryškinus raktinius žodžius, jie bus suvokiami kaip šlamštas.

    Įdomu, kaip sukurti HTML puslapį? Norėdami tai padaryti, turite praleisti kelias valandas, ir jūs žinosite, Ir jūs galite sukurti savo pirmąjį puslapį per 5 minutes.

    HTML reiškia „HyperText Markup Language“. Išvertus tai reiškia „hiperteksto žymėjimo kalbą“. Svarbu suprasti, kad HTML yra ne programavimo kalba, o svetainės žymėjimo kalba.

    Visos šiuolaikinės naršyklės gali tai atpažinti. Tada jie pateikia informaciją patogiu būdu, kaip iš anksto numatė autorius.

    Ši kalba naudoja specialias žymas. Kiekviena žyma atlieka savo funkciją. Jų yra labai daug. Idealiu atveju reikia visko išmokti. Tačiau pradedančiajam visiškai pakanka elementarių žinių.

    HTML pagrindai

    Prieš kurdami HTML puslapį, turite žinoti, iš ko jis susideda. Šioje kalboje yra dvi sąvokos: elementas ir žyma.

    Atidarymo ir uždarymo žymos naudojamos norint nurodyti, kur šis elementas prasideda ir baigiasi. Tai atrodo taip.

    turinį

    Kaip matote, vienintelis skirtumas tarp pradžios ir uždarymo žymos yra „/“.

    Visas HTML dokumentas yra šių elementų rinkinys. Dokumento struktūrai keliami tam tikri reikalavimai. Visas puslapio turinys turi būti tarp dviejų ir žymų. Kai rašote kodą, įpraskite iš karto įtraukti pradžios ir uždarymo žymas.

    Taip pat atminkite, kad HTML kalbos struktūra turi savo hierarchiją. Kitu atveju jis vadinamas lizdavimu. yra svarbiausia, nes visi kiti yra joje.

    HTML turi du antrinius elementus:

    • ... ;
    • .. .

    HEAD blokas rodo įvairią aptarnavimo informaciją. Ši informacija naršyklėje nerodoma. Pavyzdžiui, instrukcijos kūrėjams, bet kurioms programoms, robotams ir daug daugiau.

    Svarbiausia, kad čia nėra turinio.

    Skiltyje BODY nurodomas dokumento turinys, kuris bus rodomas vartotojui.

    Išmokite iš karto kurti atviras ir uždaras žymas, nes gali būti 10 įdėtų elementų. Be to, patogumo sumetimais rekomenduojama įtraukti įdėtas žymas. Pavyzdžiui, šitaip.

    Tai daroma taip, kad vienodos svarbos žymos būtų tame pačiame lygyje, o antrinės žymos būtų „viduje“. Taip daug lengviau suprasti ir rasti tinkamą kodo dalį. Priešingu atveju galite susipainioti. Tačiau norint sutaupyti vietos, patį korpusą galima padaryti be įdubimų. Tai daroma taip, kad visi kiti neturėtų papildomos įtraukos. Visa kita patartina atskirti.

    Kaip sukurti paprastą HTML puslapį

    Norėdami parašyti kodą, jums reikia tam tikro redaktoriaus. Jų yra labai daug. Populiariausi yra Notepad++ ir Adobe Dreamweaver. Taip pat galite naudoti užrašų knygelę.

    Taip atrodo „Notepad++“ redaktorius.

    Tai labai patogus redaktorius ir tuo pačiu nemokamas. Aukščiau pateikta „Adobe Dreamweaver“ yra mokama versija. Skirtumas tarp rašymui skirtų redaktorių ir bloknoto yra tas, kad paryškinamos specialios žymos. Jei neparyškinta, vadinasi, parašei neteisingai.

    Kad apšvietimas atitiktų kalbą, jis turi būti nurodytas nustatymuose.

    Pažiūrėkime, kaip sukurti HTML puslapį Notepad. Tai yra, baigkime techninę dalį ir pereikime tiesiai prie žymų tyrimo.

    Kaip sukurti tinklalapį HTML užrašų knygelėje

    Norėdami pradėti, atidarykite užrašų knygelę.

    Tada įveskite tai, kas nurodyta toliau esančioje ekrano kopijoje.

    Įpraskite rašyti rankomis, o ne tik kopijuoti. Kai rašote rankomis, geriau atsimenate visą žymos pagrindą.

    Po to galite atidaryti failą naršyklėje ir grožėtis rezultatu. Dabar turėtumėte suprasti, kaip sukurti tinklalapį HTML užrašų knygelėje.

    Pasaulinis konsorciumas W3C

    Yra organizacija W3C, kuri kuria ir diegia visus interneto standartus. Visos naršyklės laikosi šių standartų ir apdoroja puslapio žymėjimą (kodą) pagal šias taisykles.

    Oficialioje HTML kalbos kūrėjų svetainėje galite rasti lentelę su visomis žymomis ir jų naudojimo taisyklėmis. Šiame straipsnyje mes apsvarstysime pagrindinius.

    Galbūt galvojate, kokios galėtų būti taisyklės? Visos aprašytos žymos turi savo rekomendaciją. Jų yra keletas:

    • Neprivaloma žyma.
    • Draudžiama.
    • Tuščia žyma.
    • Pasenusi
    • Prarastas.
    Žymos HTML

    Prieš kurdami HTML puslapį, turite suprasti, kas turėtų būti HEAD aptarnavimo dalyje.

    Srityje HEAD yra privalomos ir pasirenkamos žymos. Reikalinga žyma yra pavadinimas. Jis pažymėtas antrašte. Jis priskiriamas visam dokumentui. Ir tai, ką matote Google paieškos sistemos rezultatuose, yra pavadinimo žyma.

    Pereikime prie skyriaus KŪNAS. Yra elementų, kurie rodomi naršyklėje, ir yra tokių, kurie nerodomi. Pavyzdžiui, komentarai vartotojui nerodomi. Jie gali būti naudojami užrašams arba užuominoms kitiems darbuotojams, jei dirbate komandoje.

    Jie pažymėti kaip

    Viskas, kas yra tarp jų, programoje laikoma tokia. Atminkite, kad negalite įdėti komentaro žymos į kitą komentaro žymą. Nes kai tik atsidarysi .

    Tokio lizdo pavyzdys:

    pirmojo komentaro tęsinys -->

    Naršyklėje rezultatas bus toks

    pirmojo komentaro tęsinys -->

    Štai gabalas nebus matomas. Antroji atidarymo žyma Dar šiek tiek teksto

Kyla klausimų?

Pranešti apie rašybos klaidą

Tekstas, kuris bus išsiųstas mūsų redaktoriams: