Sveiki, mieli tinklaraščio svetainės skaitytojai. Šiandien pradėsime kalbėti apie žymas HTML kalba, būtent antraštes H1, H2, H3, H4, H5, H6, apie pastraipas P ir eilučių lūžius Br, taip pat apie horizontalios linijos žymą Hr, kurios pavyzdyje apsvarstysime atributų naudojimą ir pažiūrėkime, kur bus galima sužinoti visus įmanomus kiekvieno elemento atributus ir pažvelgti į jų reikšmių sintaksę.

Pagrindinis skirtumas tarp eilutinių ir blokinių žymų yra tas, kad pirmosios gali sekti viena kitą pločio, kol baigsis jai skirta vieta, ir tada jos bus perkeltos į kitą eilutę.

Pagal numatytuosius nustatymus pabandykite blokuoti elementus užimti visą laisvą erdvę taigi kitas bloko elementas būtinai bus kitoje eilutėje.

Dabar pradėkime sistemingą visų galimų HTML žymų tyrimą ir tuo pat metu atkreipsime ypatingą dėmesį į tai, kokiam tipui jie priklauso, kad aiškiai suprastume jų teisingo (galiojančio) naudojimo galimybes. Supaprastinta žymų struktūra atrodo taip:

Jie taip pat turi atributus (kiekvienas turi savo rinkinį), kurie leidžia pridėti tam tikrų savybių prie šio elemento, tačiau apie tai kalbėsime su konkrečiais pavyzdžiais.

Pradėkime nuo tokio dalyko kaip antraštės, kurios formuojamos naudojant suporuotas žymes H1, H2, H3, H4, H5, H6 (pavadinimas kilęs iš pirmosios žodžio „Antraštė“, t.y. „pavadinimas“ raidės). Jie skirti atskirti skirtingus teksto fragmentus vienas nuo kito ir pažymėti jų svarbą priklausomai nuo lygio. Šiuolaikinėje HTML kalbos versijoje visos žymos ir visi joms leidžiami atributai yra iš anksto nustatyti ir aprašyti.

Dėl to antraštės gali turėti tik šešis lygius ir, be to, elementus H1-H6 yra blokuoti, t.y. paprastai užima visą laisvą vietą puslapio plotyje. Tačiau jie turi vieną ypatumą – antraštės žymose gali būti tik įterptieji elementai, nepaisant to, kad, pavyzdžiui, tas pats Div leidžia į vidų įtraukti kitas blokines žymas.

Tai. naršyklė neleis, pavyzdžiui, vieno lygio antraščių įtraukti į kito lygio antraštes, nes tai vėlgi yra blokiniai elementai, bet juose gali būti tik mažosios raidės. Oi kaip.

Pavadinimai skirtingi lygiai Naršyklėse H1-H6 bus nupieštas skirtingų dydžių šriftais (nors naudojant CSS, galite nustatyti absoliučiai bet kokį dydį, spalvą ir šrifto tipą, kad būtų rodomas naršyklėje, tačiau gryname HTML, tokios taisyklės):

Jei atsižvelgsime į svetainės išdėstymą, kad būtų patogu toliau reklamuoti (), tada verta paminėti, kad turėtų būti tik viename puslapyje viena H1 antraštė. Tikriausiai galėtumėte naudoti du H1, bet daugiau nei tai greičiausiai sukels paieškos sistemų atsaką, kai jie pasieks jūsų dokumentą. Jūsų veiksmai gali būti laikomi šlamštu arba sukčiavimu.

Taip pat nerekomenduojama praleisti antraštės lygių, t.y. po H1 turėtumėte naudoti H2, kad paryškintumėte ne tokias svarbias teksto dalis ir pan. Mažai tikėtina, kad tai sukels rimtų sankcijų iš paieškos sistemų, tačiau vis tiek geriau vadovautis logika formuojant antraštės lygius HTML kode.

Paieškos sistemos teikia daugiau reikšmės žodžiams, esantiems šiose žymose, nei tiesiog tekste esantiems žodžiams. Tai leidžia daryti išvadą, kad rašydami straipsnius būtinai turėtumėte papildyti naudojamas antraštes.

Na, savaime antraštės straipsnio tekste daro jį vizualesnį ir padeda skaitytojams greitai naršyti informacijos rinkinyje. Manau, kad pirmą kartą informacijos užteks ir laikas judėti toliau.

Pastraipa, eilutės lūžis ir horizontali eilutė HR HTML kode

P žyma yra kilusi iš žodžio „pastraipa“, bet dažniau vadinama pastraipa. Jie naudojami tam tikrai teksto daliai, kurią paprastai sudaro keli sakiniai, paryškinti. Tarp pastraipų, kurias sudaro P elementai vertikaliai, atsiranda tuščia vieta, kuri leidžia atskiros loginės teksto dalys vizualiai vienas nuo kito.

Reikalas tas, kad žmogui gana sunku perskaityti teksto monolitą, jei jis nėra padalintas į atskirus mažus fragmentus. Pavyzdžiui, aš net nepradedu skaityti straipsnių, kurie nėra suskirstyti į pastraipas HTML kodu, nes tai labai erzina.

Jūs stipriai laužote tekstą sumažinti savo nuovargio slenkstį jūsų išteklių lankytojų ir pagerinti naudotojo veiksnius (laiką, kurį naudotojas praleidžia jūsų svetainėje ir), kurie savo ruožtu turi teigiamą poveikį reklamai.

Tais pačiais tikslais (patraukti vartotojų dėmesį ir sumažinti jų nuovargį skaitant straipsnį) jie papildo tekstą įvairiais, o kartais, galbūt, papildais.

Beje, pastraipos žyma P, kaip tikriausiai jau pastebėjote, yra porinė žyma, tačiau pagal hiperteksto žymėjimo kalbos 4.01 specifikaciją jos uždarymo elementas yra visiškai neprivaloma. Tokiu atveju naršyklė turės pati išsiaiškinti, kur ją reikia įdėti.

Kadangi P yra blokinis elementas, jo viduje gali būti dedami tik eilutiniai elementai. Todėl naršyklė, radusi pradžios pastraipos žymą, analizuoja kodą toliau ir vos užklydusi į kitą bloko elementą (greičiausiai tai bus kitas atidaromasis P), iš karto prieš jį įterpia baigiamosios pastraipos žymą. Html 5 standarte greičiausiai tokių laisvių nebus ir jums reikia nedelsiant priprasti uždaryti visas žymas ir rašykite jas tik mažosiomis raidėmis.

Pastraipa yra blokinis elementas, todėl tekstas pastraipų viduje bus linkęs užimti visą jam skirtą erdvę. Tai yra, jei į dokumento HTML kodą įrašėte ketureilį taip, kaip turėtų būti (kiekviena eilutė atskirai), ir įtraukėte šį ketureilį visiškai į P pastraipos žymas, tada naršyklėje pamatysite, kad visos jūsų keturios eilutės susijungs į vieną ir užims visą tekstui skirtos vietos plotį.

Kodėl taip nutinka, mes jau išsamiai aptarėme straipsnyje apie. Dėl šios hiperteksto žymėjimo kalbos savybės (kad bet koks tarpų simbolių skaičius šaltinio kode bus pakeistas vienu tarpu, kai jie rodomi naršyklėje), galite suformatuoti kodą bet kokiu patogiu būdu, nebijodami sugadinti jo rodymą. tinklalapį.

Na, o jei jums tikrai reikia parašyti keturkampį visuotinai priimta forma, galite naudoti papildomą HTML

eilutės lūžio žymos, vadinamos BR

(nuo žodžio „pertrauka“):

BR yra eilutinis elementas ir taip pat „tuščias“, t.y. vienvietis (neturi uždarymo elemento). Visa BR funkcija yra ta, kad naršyklėje rodomas tekstas sukelia eilutės lūžį (panašiai kaip bet kurio teksto rengyklės klavišą Enter).

BR žymų (eilutės pertraukos) rašymas kode niekaip nereglamentuojamas. Galite parašyti visą tekstą kartu ir tinkamose vietose įdėti BR vietoj tarpų arba galite iš karto suskaidyti tekstą į eilutes kode ir įdėti BR arba eilučių pabaigoje, arba jų pradžioje. Tai nekeičia esmės.

HR(žodžių „horizontali taisyklė“ santrumpa, t.y. horizontali linija) – labai paprasta HTML žyma, nubrėžianti horizontalią liniją (juostelę) per visą ekrano plotį ir storį, priklausantį nuo naršyklės, kurioje žiūrima ( iš esmės tai yra vaizdinis žymeklis, kuris, analogiškai su antraštės žymomis, leidžia suskaidyti tekstą į logiškas dalis, kad būtų lengviau įsisavinti).

Jis yra „tuščias“ (vienvietis), t.y. neturi poros (pabaigos žyma). Be to, HR yra blokinis elementas, t.y. pagal numatytuosius nustatymus jis užima visą jam prieinamo puslapio plotį.

Atributų samprata ir jų rašymo HTML žymose taisyklės

Panagrinėkime tokią sąvoką kaip šio paprasto elemento atributą. Faktas yra tai, kad prie žymų galime pridėti galiojančių atributų ir WC3 tikrinimo priemonėje aprašytų atributų, taip suteikdami turiniui reikalingą ypatybę.

Pavyzdžiui, jei turite keletą pastraipų (pastraipų) eilutėje, įtrauktoje į atitinkamas P žymas, tada norint pakeisti vienos iš jų išvaizdą, tereikia pridėti reikiamus atributus prie šios pastraipos pradinio P elemento. Vienos (tuščios) žymos atveju iš viso nėra parinkčių, kur pridėti reikiamą atributą.

Taigi pirmoji taisyklė yra atributai dedami tik į pradinę žymą(užbaigiamajame niekada nieko nėra). Viename elemente gali būti keli atributai, kurie yra atskirti vienas nuo kito ir tarp žymos pavadinimo tarpu (privaloma sąlyga). Leiskite man iš karto pateikti pavyzdį, kaip jie naudojami horizontaliai HR linijai:

Taigi pirmiausia pereikime prie atributų sintaksės. Jie įterpiami į pradinę žymą, rašomi su tarpu (įskaitant tarpą po elemento pavadinimo) ir yra konstrukcija, apimanti pavadinimą, „lygybės“ ženklą ir rašoma kabutėse (paprastai įprasta dėti porinius dublius, bet standartas leidžia ir porinius pavienius). kabutes) reikšmes. Atributų tvarka žymos HTML kode nėra svarbi.

Ten pateikiau nuorodą į visų HTML leidžiamų žymų sąrašas. Jei šiame sąraše spustelėsite jus dominančio elemento pavadinimą (mūsų atveju tai yra HR), būsite nukreipti į puslapį su išsamia jo specifikacija:

Visi bet kurios žymos atributai gali būti suskirstyti į tris grupes:

1. Bendra – jie gali būti daugumoje HTML kalbos elementų. Viršuje esančiame paveikslėlyje jie yra apačioje ir aptraukti raudonai. Tiesą sakant, yra nedaug bendrų atributų (tik šeši), ir net tada mažai tikėtina, kad juos visus naudosite savo praktikoje. Greičiausiai tik keturi - , pavadinimas ir stilius.
2. Įvykio atributai – jie reikalingi tam, kad būtų suaktyvintas veiksmas reaguojant į vartotojo veiksmą arba sistemos įvykį. Jie labiau susiję su „JavaScrit“ ir yra aukščiau esančio paveikslo apačioje (apbraukti tamsiame langelyje).
3. Unikalus – kiekviena žyma paprastai turi savo atributų rinkinį, kai kurių iš jų gali visai nebūti kituose elementuose. Jei atsižvelgsime į horizontalią liniją HR, tada ji turi tik keturis unikalius atributus (lygiuoti, noshade, dydis ir plotis). Visų kitų, nurodytų HR žymoje (išskyrus dvi aukščiau aprašytas grupes), naršyklė nepaisys.

HR horizontalios linijos žymos atributų pavyzdžiai

Įvairių atributų reikšmės gali būti savavališki skaičiai (ir tt) arba reikšmės iš iš anksto nustatyto rinkinio, pavyzdžiui, lygiuojant HR – kairėn|centro|dešinėn (galite naudoti vieną iš trijų lygiavimo). galimybės).

Apskritai informaciją apie juos WC3 tikrintuve galima gauti ne tik HTML žymų sąraše, bet ir atributų sąrašas kurią galite rasti žemiau esančioje nuorodoje.

Šis sąrašas apima visus galimi variantai visoms žymoms, prieinamoms HTML kalba. Stulpelyje „Susiję elementai“, esančiame priešais jus dominančią parinktį, bus pateikti elementai, kuriuose galima naudoti šį atributą. Stulpelyje „Tipas“ nurodomas duomenų tipas, kurį galima naudoti kaip jų vertę.

Pavyzdžiui, eilutėje, pabrauktoje paveikslėlyje, skirtoje lygiavimo atributui, žymai HR, leidžiamos tik trys fiksuotos vertės, kurios yra nurodytos ten (kairėje | centre | dešinėje).

Kita labai svarbi rubrika – „Depr“. Jei raidė D yra prieš jus dominantį požymį šiame stulpelyje, tada ji naudoti nerekomenduojama, ir turėtumėte pritaikyti atitinkamus CSS stilius, kad jį pakeistumėte. Peržiūrėdami žymos specifikaciją taip pat pamatėme, kad šalia visų keturių HR atributų pavadinimų yra parašytas žodis „Deprecated“ (naudoti nerekomenduojama).

Pažiūrėkime, kokie atributai naudojami su elementais, kuriuos iki šiol aptarėme šiame straipsnyje (P, antraštės H1–H6 ir HR). Visiems jiems galite naudoti "sulyginti", nes visi šie elementai yra blokiniai elementai. Įterptųjų elementų lygiavimo atributas praranda prasmę.

Pavyzdžiui, jei prie antraštės žymos pridedate „lygiuoti“ (pvz., H1), galite nustatyti antraštės teksto lygiavimą. Tie. bloko elementas užims visą jam skirtą vietą pločio, tačiau šios antraštės turinys (jos tekstas) gali būti sulygiuotas kairėje (kairė yra numatytasis) arba dešinėje (dešinėje) arba centre (centre). ), arba plotyje (pagrįskite – keičiasi atstumas tarp žodžių, kaip laikraščių skiltyse).

Tas pats, beje, galioja HTML pastraipos žymai P ir konteineriui Div, jei atidžiai pažvelgsite į aukščiau pateiktą ekrano kopiją.

Horizontalios HR linijos atributas „lygiuoti“ reiškia horizontaliausios linijos, kurią sudaro tas elementas, lygiavimą. Tačiau HR žyma yra blokinis elementas ir paprastai užima visą turimą plotą. Todėl prasminga jame naudoti „lygiuoti“ tik tuo atveju, jei nustatykite atributo "width" reikšmę(plotis) mažesnis nei puslapio plotis.

Kaip „pločio“ reikšmę galite naudoti tik skaičius (tai bus plotis pikseliais) arba galite naudoti procentinę dalį nuo bendro horizontalios HR linijos pločio. Tos pačios žymos atributo „dydis“ reikšmė nustatoma skaičiais, rodančiais horizontalios linijos aukštį pikseliais. Pažvelkime į tai su pavyzdžiu:

---

HR žyma Html 4.01 standarte turi dar vieną atributas, vadinamas viengubu, nes jis negali turėti jokios reikšmės (tai tik reiškia tam tikrą veiksmą) – tai „noshade“, neleidžianti horizontaliai linijai mesti šešėlio:

---

Aišku, kad aš negalėsiu apsvarstyti visų galimų atributų visoms galimoms žymoms HTML, ir tai nėra būtina, nes viską galima padaryti pagal analogiją - svarbiausia suprasti sintaksę ir pačią idėją. Be to, daugelis iš jų jau tapo nerekomenduojami naudoti, nes. dabar jų funkciją atlieka CSS stiliai, apie kurį taip pat netrukus pradėsime išsamiai kalbėti.

Sėkmės tau! Greitai pasimatysime tinklaraščio puslapių svetainėje

Jums gali būti įdomu

Lentelės HTML formatu – lentelės, Tr ir Td žymos, taip pat Colspan, Cellpadding, Cellspacing ir Rowspan joms sukurti
Iframe ir Frame – kas tai yra ir kaip geriausia naudoti rėmelius HTML
Komentarų nurodymai ir Doctype HTML kode, taip pat blokų ir eilutinių elementų (žymų) sąvoka
Įterpimas ir objektas – HTML žymos, skirtos medijos turiniui (vaizdo įrašui, „flash“, garso įrašui) rodyti tinklalapiuose
Kaip į HTML įterpti nuorodą ir paveikslėlį (nuotrauką) – IMG ir A žymės
Svetainės HTML formos – žymos Form, Input and Select, Option, Textarea, Label ir kt., skirtos žiniatinklio formos elementams kurti
Šriftas (veidelis, dydis ir spalva), Blockquote ir išankstinės žymos – nebenaudojamas teksto formatavimas grynu HTML (nenaudojant CSS)
Tarpo simboliai ir jų kodo formatavimas HTML, taip pat nepertraukiami tarpai ir kiti mnemoniniai ženklai
Kaip sukurti hipersaitą (A, Href, Tikslas tuščias), kaip jį atidaryti naujame svetainės lange, taip pat padaryti vaizdą nuoroda HTML kode

Ir šiandien mes atidžiau pažvelgsime į tai, kas yra html žymes ir juos atributai Pavyzdžiui p, br, val; ir kokį vaidmenį atlikti atributų reikšmėsžymas, esančias html dokumente.

Prieš pradėdamas, norėčiau atsiprašyti už ilgą nebuvimą. Faktas yra tas, kad dėl užsiėmimo vienu projektu turėjau kuriam laikui atsisakyti tinklaraščio atnaujinimo ir kiek atsilikau nuo grafiko. Tačiau dabar viskas baigėsi ir tikiuosi ir toliau išlaikyti tą patį ritmą bei reguliariai aprūpinti šviežiomis medžiagomis.

Dabar grįžtu prie numatytos temos. Susipažindamas su html pagrindais jau rašiau apie html dokumentų struktūrą, kur taip pat pateikiau paaiškinimus apie pagrindines html, head ir body žymes, kurios turi būti kiekviename dokumente, taip pat specialią žymą.vadinama deklaracija.

Tame pačiame skyriuje pateikiama informacija apie , leidžianti naudoti sąrašų sudarymo galimybę. Be to, svetainėje galite susipažinti su formomis ir atskirai su žymomis, leidžiančiomis kurti įvairias formas: .

Gavęs iš jūsų, mieli skaitytojai, daug palinkėjimų atsiliepimų formoje ir el. paštu, nusprendžiau grįžti į pradžią ir plačiau panagrinėti, kokios žymos apskritai egzistuoja, kaip jos klasifikuojamos ir kas yra html žymų atributai. . Taigi, pradėkime.

Dvigubos ir viengubos, blokinės ir eilutinės HTML žymos: p, br, hr

Kaip tikriausiai jau supratote iš ankstesnių tinklaraščio įrašų, žyma yra pagrindinė struktūrinis vienetas hiperteksto žymėjimo kalba HTML (Hyper Text Markup Language). Apskritai tai yra žymų rinkinys, kuris nustato html kodą, apibūdinantį konkretų dokumentą (pavyzdžiui, vieną iš jūsų šaltinio puslapių).

Žymos skirstomos į suporuotas ir pavienes, taip pat į blokines ir eilutes. Dabar eilės tvarka apsvarstysime jų skirtumo esmę, naudodami populiariausių ir dažniausiai naudojamų žymų pavyzdį. Beje, daugelyje šaltinių galite rasti blokinių ir įterptinių elementų pavadinimus, žinokite, kad jie yra vienas ir tas pats.

Norėdami pradėti, ponios trumpi apibrėžimai. Suporuotos html žymos- elementai, turintys atidarymo ir uždarymo žymas, tarp kurių įterpiamas turinys, neturi vienos uždarymo žymos. Blokų elementais vadinami elementai, kurie užima visą turimą plotį, jo aukštį lemia turinys. Todėl pagal numatytuosius nustatymus keli bloko elementai bus vienas po kito.

Blokų elementus galima įdėti, bet ne visus, daugiau apie tai vėliau. Įterptosiose žymose paprastai yra teksto ar kitų įterptųjų elementų, tačiau blokinės žymos įterptųjų žymų viduje neleidžiamos. Įterptosios žymos, skirtingai nei blokinės žymos, yra vienoje eilutėje ir perkeliamos į kitą tik prireikus, kai baigiasi laisvos vietos plotis.

Tikriausiai pradedantiesiems dar sunku ir galvoje sumaištis, bet pradžia yra pradžia. Ateityje viskas paaiškės, esu tuo tikras. Be to, kreipiuosi į konkrečius pavyzdžius, pagrįstus bendromis žymomis, kiekvieną kartą pažymėdamas, į kuriuos elementus, eilutę ar bloką, suporuotą ar vieną, kiekvienas iš jų nurodo.

Pradėkime nuo žymos p, kurią kiekvienas žiniatinklio valdytojas naudoja tiesiogine prasme kiekvieną minutę, aš neperdedu. Šio elemento pavadinimas kilęs iš pradinės raidės Angliškas žodis pastraipa (pastraipa, pastraipa). Ji skirta išryškinti teksto fragmentus, kuriuos tokiu būdu skaitytojams lengviau suvokti. Pavyzdžiui, šiuo metu aš rašau straipsnį ir karts nuo karto paryškinu įrašo tekstą į pastraipas, tai galite pamatyti.

Suskaidydami tekstą į fragmentus ir padarydami jį kuo lengvesnį šaltinio lankytojams, galite gerokai patobulinti išteklius paieškos sistemomis, o tai svarbu jį reklamuojant.

Žinoma, p elementas yra suporuotas, nes jis turi atidarymo ir uždarymo žymas. Tuo pačiu metu tai yra blokinis elementas, kuriame gali būti tik įterptųjų elementų. Pavyzdžiui, jei rašote tam tikrą tekstą keliose eilutėse ir įtraukite jį tarp pradžios ir uždarymo p žymų, naršyklė vis tiek parodys jį vienoje eilutėje ir tik tuo atveju, jei tekstas netilps vienoje eilutėje, jis bus apvyniotas.

HTML žymės P žyma yra blokinis elementas P žymės turinys

Tačiau norint, kad šis tekstas būtų rodomas keliomis eilutėmis, reikia naudoti elementą br (iš anglų kalbos „break“), kuris yra vienas, tai yra, jis neturi uždarymo žymos, taip pat yra įterptinis elementas. Įdėję jį kiekvienos teksto eilutės, kuri yra p žymės turinys, pabaigoje, gauname norimą parinktį:

HTML žymės
p žyma – bloko elementas
p žymos turinį

br žymų rašymas yra beveik nemokamas. Tai yra, galite pasirinkti kelias eilutes vienu metu ir įdėti šią žymą kiekvienos iš jų pabaigoje arba galite tiesiog parašyti tekstą įprastu būdu ir įterpti br į tariamų brūkšnelių vietas. Į p bloko žymos turinį įtrauktų br elementų skaičius gali būti tiek, kiek norima. Tai yra, iš naujos eilutės galima parašyti tiek teksto, kiek norite.

Dabar pažvelkime į kitą paprastą žymą, apie kurią plačiau pakalbėsime straipsnio pabaigoje. Tai apie hr žymą (iš anglų kalbos horizontali taisyklė- horizontali linija), kuri yra viena, bet tuo pačiu ir blokinė, nes pagal nutylėjimą ji užima visą galimą plotį. Jame aprašoma paprasta horizontali linija, kuri yra naudinga dalijant puslapio turinį į logines dalis. Tai gali būti teksto padalijimas, vaizdų grupės ar kita dizaino dalis.

Šios horizontalios linijos išvaizda priklauso nuo naršyklės, kurioje peržiūrimas puslapis, kurio html kode yra šis elementas. Be to, šios eilutės išvaizda, kaip ir kitų elementų išvaizda, gali būti redaguojama naudojant įvairius atributus. Čia mes sklandžiai priartėjome prie kitos mūsų šiandieninės temos komponento, ty html žymos atributų koncepcijos.

HTML žymų atributai ir jų klasifikacija

HTML žymų atributai leidžia suteikti joms papildomų savybių ir paįvairinti naršyklės rodomų tinklalapio elementų išvaizdą. Kiekviena žyma gali turėti keletą atributų. Kiekvienas iš jų vaidina svarbų vaidmenį formuojant tam tikros svetainės puslapio srities dizainą. Atributai rašomi pradinėje žymoje po paties elemento pavadinimo. Jei yra keli atributai, jų eiliškumas neturi reikšmės, gali būti bet koks.

Beveik kiekvienas atributas turi savo reikšmę (parametrą). Apskritai bet kuri viena arba suporuota žyma gali būti schematiškai pavaizduota taip:

Atkreipkite dėmesį, kad norėdami nurodyti atributo reikšmę, po atributų pavadinimų turėtumėte dėti lygybės ženklą, o pačią reikšmę įterpti į viengubas arba dvigubas kabutes. Atributai gali būti tiek eilutiniuose, tiek blokiniuose atributuose; tiek atskirose, tiek suporuotose žymose.

Natūralu, kad vieno elemento atveju uždarymo žyma nebus. Visi atributai ir jų reikšmės yra įrašyti pradinėje žymoje ir turi būti atskirti tarpu, kitaip atitinkama sritis naršyklėje nebus rodoma teisingai. Taip, beveik pamiršau, kai kurie atributai gali būti be vertybių. Žinoma, neįmanoma išardyti visų žymų kartu su visais įmanomais atributais, ir tai nesvarbu, svarbiausia suprasti jų taikymo mechanizmą. Oficialiame puslapyje galite peržiūrėti visas rekomenduojamas html žymas.

Tiesa, yra duomenų, atitinkančių oficialiai galiojančius html 4.01 standartus. Tačiau html 5 versijos diegimas vyksta dideliu tempu, pagal kurio taisykles jau žaidžia populiarios naršyklės. Ir į nauja versija hiperteksto žymėjimo kalba, kai kurios žymos ir atributai jau bus negaliojantys, tai yra, neatitiks html standartų. Todėl žengsime koja kojon su laiku ir ateityje Jums pasiūlysiu tik galiojančias žymas ir atributus, o ateityje mokysimės, kaip išvengti html kodo standartų nesilaikymo, medžiagos šia tema pasirodys labai greitai.

Tačiau pažvelkime į oficialų W3C puslapį, kuriame pateikiama rekomenduojamų html žymų lentelė. Jei spustelėsime nuorodą su mus dominančia žyma (aiškumo dėlei paimsime jau minėtą hr žymą, juolab kad su ja nagrinėsime vieną pavyzdį žemiau), tada būsime perkelti į šį tinklalapį, kuriame pateikiama specifikacija pateikta apie šį elementą:

Visus elementų atributus galima suskirstyti į tris grupes:

1. Bendroji atributų grupė- jie taikomi beveik visoms html žymoms. Aukščiau esančioje ekrano kopijoje jie paryškinti žaliame rėmelyje.
2. Unikalios savybės- atributų, būdingų tik šiam elementui, rinkinys (paveikslo žymoje hr jie pabraukti purpurine spalva: lygiuoti, noshade, dydis, plotis). HTML 5 specifikacija pridėjo naują spalvos atributą, kuris apibrėžia horizontalios linijos spalvą.
3. Vystymai– Šie atributai reikalingi, kai reikia atlikti tam tikrus veiksmus, reaguojant į vartotojo veiksmą. Ekrano kopijoje jie paryškinti mėlyname rėmelyje.

Informacijos apie atributus taip pat galite rasti kitame W3C puslapyje, kuriame yra lentelė su visu html atributų sąrašu:

Šioje lentelėje pateikiami visi visų žymų, esančių hiperteksto žymėjimo kalboje, atributai. Stulpelyje „Susiję elementai“ prie reikiamo atributo yra pažymėtos žymos, kuriose galima naudoti šį atributą. Stulpelyje „Tipas“ nurodomas duomenų tipas, kurį galima naudoti kaip atributo reikšmę. Pavyzdžiui, lygiavimo atributui (kuris nurodo elemento lygiavimą) yra trys galimos reikšmės (kairėje, centre, dešinėje).

Jei stulpelyje „Dept“ yra raidė D, šis atributas nerekomenduojamas, kitaip html dokumentas nebus patvirtintas. Šiuo atveju būtina naudoti css stilius, kuriuos, kaip jau pažymėjau, artimiausiu metu išnagrinėsime. Tai būtina, nes tendencija yra tokia, kad dauguma HTML 5 atributų yra nebenaudojami, o elementų išvaizda turėtų būti apibrėžta naudojant css.

Beje, visiškai išsami informacija su pridėtomis žymomis ir jų atributais pagal html 5 pateikiama viename iš geriausių, mano nuomone, išteklių, skirtų html pagrindams išmokti, būtent htmlbook ir rusų kalba.

Kaip rodyti horizontalią liniją naudojant hr žymą

Veiksime palaipsniui. hr elementas be atributų apibrėžia paprastą horizontalią liniją, kuri užima visą erdvės plotį (žr. pavyzdį aukščiau). Paeiliui taikydami įvairius atributus hr žymai, pakeisime horizontalios linijos išvaizdą.

Pirmiausia parašykite lygiavimo ir pločio atributus. Kalbant apie lygiavimą, prasminga jį naudoti tik tada, kai nustatytas atributas plotis, kuris nurodo elemento plotį (mažesnį nei puslapio plotis). Leiskite jums priminti, kad hr žyma yra blokinis elementas ir pagal numatytuosius nustatymus užima visą laisvą plotį.

Atributo plotis reikšmė gali būti arba skaičiai (tokiu atveju plotis bus nustatytas pikseliais) arba procentai, nustatantys elemento plotį kaip laisvos vietos dalį. Dydžio atributo reikšmė pateikiama skaičiais ir nusako elemento aukštį (šiuo atveju horizontalios linijos storį). Taigi pažiūrėkime į pavyzdį:

---

Tada prie aukščiau pateikto pridėkite atributą noshade. Faktas yra tas, kad naudojant hr žymą trimačiai efektai (šešėlis) naudojami pagal numatytuosius nustatymus, tai galite pamatyti žiūrėdami į šiek tiek aukščiau esančią eilutę. Rašydami noshade atributą, mes uždraudžiame juos naudoti.

---

Dabar pabandykime pridėti spalvos atributą, kuris apibrėžia horizontalios linijos spalvą. Atminkite, kad naudojant šį atributą 3D efektai automatiškai išjungiami, todėl nereikia naudoti noshade. Kaip reikšmę nustatome spalvos pavadinimą, pavyzdžiui, „mėlyna“.

---

Taip toliau konkretus pavyzdys p, br, hr mes pažiūrėjome, kaip html žymos, taip pat įvairūs naudojami atributai, veikia įvairių elementų formavimą tinklalapyje. Netrukus paskelbsiu šios temos tęsinį, tad norėdami gauti naujos medžiagos, nepamirškite užsiprenumeruoti tinklaraščio atnaujinimų per RSS kanalą arba el. Leiskite man išeiti su geriausiais linkėjimais.

Žyma

Žyma

naudojamas puslapiui padalinti į pastraipas. Jame gali būti tik teksto ir įterptųjų žymų (eilutės lygio žymos). Tuo pačiu metu žyma

Tai yra blokas, tai yra, sukuria eilutės lūžį prieš ir po savęs. Be to, jis nustato laisvos vietos viršuje ir apačioje nuo jo šonų iki aplinkinio konteksto paraštes (maržą), dėl ko puslapis vizualiai padalinamas į pastraipas. Žymos lauko dydis

Tai priklauso nuo naršyklės tipo, bet apytiksliai lygi vienos teksto eilutės aukščiui dabartiniame puslapyje.

Uždarymo žyma

yra neprivaloma. Jei jos nėra, tada pirmoji ne eilutinė žyma, esanti žemiau puslapio HTML kode, bus laikoma pastraipos pabaiga.

Atributai

Asmeninės savybės:

• lygiuoti – nustato horizontalų pastraipos turinio lygiavimą.

• prieigos klavišas – nustato spartųjį klavišą, kad jis sutelktų dėmesį į HTML elementą.
• klasė – nurodo CSS (Cascading Style Sheets) naudojamos žymos klasės ar klasių pavadinimą.
• dir – nurodo teksto kryptį elemente.
• - nurodo HTML žymos ID pavadinimą, kuris gali būti naudojamas kaip "inkaras" arba stiliaus lapuose.
• lang – nurodo kalbą, kuria rašomas tekstas HTML elemente.
• stilius – reikalingas eilutiniams CSS stiliams taikyti žymai.
• tabindex – nustato tabuliavimo tvarką tarp elementų (Tab klavišas).
• title – rodo patarimą, kai pelės žymeklis yra virš HTML elemento.

Žymės tipas

Paskirtis: tekstas (blokai).

Žymės modelis: blokas (blokas, bloko lygis).

Gali būti:įterptosios žymos, paprastas tekstas ir HTML specialieji simboliai(mnemonika).

Atidarymo žyma: būtina. Uždarymo žyma: neprivaloma.

Sintaksė

turinys

HTML pavyzdys: P žymės taikymas

Viena iš klaidų, kurias daro pradedantieji svetainių kūrėjai, yra nevienodų vaizdų arba ryškių spalvų naudojimas fono teksto informacijai puslapyje. Tai ne tik apsunkina skaitymą, bet ir neigiamai veikia vartotojų regėjimą, verčia juos žiūrėti į kiekvieną eilutę ir be reikalo įtempti akis.

Dar viena klaida – visur naudoti apverstas spalvas, kai vizualinė teksto spalva šviesesnė už foną, pavyzdžiui, juodas fonas – baltas tekstas. Ši technika yra gana tinkama, bet tik ten, kur ji tikrai tinka.

HTML versijų palaikymas

Versija:	HTML 4.01	HTML 5	XHTML 1.0	XHTML 1.1
Palaikymas:	Taip	Taip	Taip	Taip

Naršyklės palaikymas

Naršyklė:	Internet Explorer	Google Chrome	Mozilla Firefox	Opera
Versija:	6.0 ir naujesnės versijos	2.0 ir naujesnės versijos	2.0 ir naujesnės versijos	9.2 ir naujesnės versijos	3.1 ir naujesnės versijos
Palaikymas:	Taip	Taip	Taip	Taip	Taip

Naršyklė					Netscape		Opera							Mozilla Firefox
Versija	5.5	6.0	7.0	8.0	8.0	9.0	7.0	8.0	9.2	9.5	1.3	2.0	3.1	1.5	2.0	3.0
Palaikoma	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip	Taip

STML:

3.2

4

XHTML:

1.0

1.1

apibūdinimas

Apibrėžia turinio pastraipą. Žyma

Tai blokinis elementas, todėl prasideda nauja eilute, viena po kitos einančios turinio pastraipos yra atskirtos vertikaliu tarpu. Tarpus galima valdyti naudojant stilius. Jei uždarymo žymos nėra, laikoma, kad pastraipos pabaiga sutampa su kito bloko elemento pradžia.

Sintaksė

turinys

turinys

Galimybės

align Nurodo turinio lygiavimą.

Uždarymo žyma

Nereikalaujama.

1 pavyzdys: žymos naudojimas

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Žymos parametrų aprašymas

Parametras ALIGN

apibūdinimas

Turinio bloko kraštų lygiavimas.

Sintaksė

Argumentai

į kairę Sulygiuokite turinį į kairę. Šiuo atveju turinio linijos išlygiuotos į kairę pusę, o dešinysis kraštas yra „kopėčių“ padėtyje. Šis lygiavimo būdas yra populiariausias mūsų svetainėse, nes leidžia vartotojui lengvai ieškoti naujos eilutės ir patogiai skaityti didelį turinį. centras Sulygiuoja turinį į centrą. turinys dedamas horizontaliai naršyklės lange arba konteineryje, kuriame yra turinio blokas. Atrodo, kad turinio eilutės yra suvertos ant nematomos ašies, kuri eina žemyn tinklalapio centre. Šis lygiavimo metodas aktyviai naudojamas antraštėse ir įvairiose antraštėse, pavyzdžiui, antraštėse, jis suteikia oficialų ir solidų turinio dizaino vaizdą. Visais kitais atvejais lygiavimas centre retai naudojamas dėl to, kad nepatogu skaityti didelį kiekį tokio turinio. dešinė Sulygiuokite turinį į dešinę pusę. Šis derinimo metodas veikia kaip ankstesnio tipo antagonistas. Būtent dešinėje pusėje išlygiuojamos turinio eilutės, o kairė lieka „suplėšyta“. Dėl to, kad nelygiuotas kairysis kraštas, būtent ten, kur skaitomos naujos eilutės, toks turinys yra sunkiau įskaitomas nei lygiuojant kairėje. Todėl lygiavimas į dešinę dažniausiai naudojamas trumpoms, ne ilgesnėms nei trijų eilučių antraštėms. Neatsižvelgiame į konkrečias svetaines, kuriose turinys turi būti skaitomas iš dešinės į kairę, kur gali praversti panašus derinimo būdas. Bet kur mūsų šalyje jūs matėte tokias svetaines. Justify Justify, o tai reiškia, kad tuo pačiu metu pateisinama kairė ir dešinė. Norėdami atlikti šį veiksmą, naršyklė šiuo atveju prideda tarpų tarp žodžių.

Numatytoji reikšmė

Analoginis CSS (CSS)

2 pavyzdys: turinio derinimas

STML 4.01 IE 5.5 IE 6 IE 7 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0

Duis te feugifacilisi. Duis autem dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum falisi null zzril delenit doloare teciu feuga. Ut wisi enim ad minim veniam, quis nostrud exerci taion ullamcorper suscipit lobortis nisl ut aliquip ex en commodo consequat. Duis te feugifacilisi per suscipit lobortis nisl ut aliquip ex en commodo consequat.

46,4 tūkst

Dažnai pradedančiuosius žiniatinklio valdytojus kankina klausimas, kodėl kai kurios svetainės užima aukštesnę vietą ir lenkia konkurentus paieškos rezultatuose. To priežastis gali būti neteisingai įdėtos h1 , h2 ... h6 žymos. Jei šios žymos įdėtos neteisingai, neatsižvelgiant į šaltinio specifiką, paieškos sistemoms sunkiau gauti tikslią informaciją apie straipsnius ir juose esančius raktinius žodžius.

Žymos H1 -h6 leidžia paryškinti antraštes įvairių lygių. Jie leidžia suprasti, kurios teksto dalys tiksliau atspindi straipsnio temą ir suteikia reitingavimo pranašumą.

Tinkamas žymėjimas leidžia paieškos sistemoms tiksliau pateikti užklausų puslapį paieškos rezultatuose, o tai teigiamai veikia šaltinio padėtį:

Kodėl mums reikia h1-h6 žymų?

Žymose yra svetainės pavadinimas, antraštės ir teksto paantraštės:

HTML antraštės žymos žymimos h iš anglų kalbos „header“, o tai reiškia „ pavadinimas, antraštė“. Štai pavyzdys, kaip tai atrodo:

antraštę

Antraštės žymos turėtų būti dedamos kiekviename šaltinio puslapyje. Tuo pačiu metu pavadinimo svarbos bus pavydėti jo skaičius, kuo jis mažesnis, tuo svarbesnis pavadinimas:

- svarbiausios žymės

- mažiau svarbios žymos...

- paskutinės svarbiausios žymos

Tačiau jų išdėstymas turėtų būti vertinamas atsargiai. Dėl netinkamo naudojimo paieškos sistemos gali nubausti jūsų išteklius.

h1-h6 žymų sintaksė

Teksto pavadinimas

1 paantraštė

...

2 paantraštė

3.1 paantraštė

...

3_2 paantraštė

3 paantraštė

Populiariausios žymos yra h1 h2 h3 .

Kaip teisingai naudoti h1 žymą?

Nepaisydami h1 žymos, žiniatinklio valdytojai atima iš savęs tokį svarbų pranašumą kaip turinio optimizavimas. Ant variklių jis dažnai rašomas automatiškai, bet ne visada, ir į šį faktą reikia atsižvelgti.

HTML h1 žyma yra pati reikšmingiausia tokio pobūdžio žyma. Jame yra svetainės pavadinimas ir straipsnio pavadinimas. Tačiau jo nereikėtų painioti su žyma