HTML p atribuudid. Sildid – mis need on ja mis need on. Miks on h1-h6 silte vaja?

Tag

Tag

kasutatakse lehe jagamiseks lõikudeks. See võib sisaldada ainult teksti ja tekstisiseseid silte (reataseme silte). Samas silt ise

See on plokipõhine, st loob reavahetuse enne ja pärast iseennast. Lisaks määrab see ümbritseva konteksti külgedelt üles ja alla vaba ruumi veerised, mille tõttu leht on visuaalselt jagatud lõikudeks. Sildi välja suurus

Sõltub brauseri tüübist, kuid see on ligikaudu võrdne ühe tekstirea kõrgusega praegusel lehel.

Sulgev silt

on valikuline. Kui see puudub, loetakse lõigu lõpp esimeseks lehe HTML-koodis allpool asuvaks tekstisiseseks märgendiks.

Atribuudid

Isiklikud atribuudid:

  • joondus – määrab lõigu sisu horisontaalse joonduse.
  • juurdepääsuklahv – määrab HTML-elemendile keskendumise kiirklahvi.
  • klass – määrab CSS-is (Cascading Style Sheets) kasutatava sildiklassi või klasside nime.
  • dir – näitab teksti suunda elemendi sees.
  • - määrab HTML-i sildi identifikaatori nime, mida saab kasutada ankruna või laadilehtedel.
  • lang – näitab keelt, milles HTML-elemendi sees olev tekst on kirjutatud.
  • stiil – nõutav sisemiste CSS-stiilide rakendamiseks märgendile.
  • tabindex – määrab tabeldusjärjestuse elementide vahel (Tab-klahv).
  • pealkiri – kuvab kohtspikri, kui hõljutate kursorit HTML-elemendi kohal.

Sildi tüüp

Eesmärk: tekst (plokid).

Sildi mudel: plokk (plokk, ploki tase).

Võib sisaldada: tekstisisesed sildid, lihttekst ja HTML-i erimärgid(mnemoonika).

Ava silt: vajalik. Sulgev silt: pole nõutud.

Süntaks

sisu

HTML-i näide: P-sildi kasutamine

seodon.ru – P-sildi kasutamine

Üks vigadest, mida algajad veebisaitide loojad teevad, on ebaühtlaste piltide või erksate värvide kasutamine lehe tekstiteabe taustaks. See mitte ainult ei muuda lugemist keeruliseks, vaid avaldab ka kahjulikku mõju kasutajate nägemisele, sundides neid iga rida piiluma ja oma silmi asjatult pingutama.

Teine viga on ümberpööratud värvide kasutamine “kõikjal”, kui tekstivärv on visuaalselt taustast heledam, näiteks must taust - valge tekst. See tehnika on üsna rakendatav, kuid ainult siis, kui see on tõesti asjakohane.



HTML versiooni tugi

Versioon:HTML 4.01HTML 5XHTML 1.0XHTML 1.1
Toetus:JahJahJahJah

Brauseri tugi

Brauser:Internet ExplorerGoogle ChromeMozilla FirefoxOoper
Versioon:6.0 ja uuemad2.0 ja uuemad2.0 ja uuemad9.2 ja kõrgem3.1 ja kõrgem
Toetus:JahJahJahJahJah

Ja täna vaatame lähemalt, mis see on html sildid ja neid atribuudid Näiteks p, br, hr; ja mis rolli nad mängivad? atribuudi väärtused html-dokumendis sisalduvad sildid.

Enne alustamist tahaksin vabandada oma pika eemaloleku pärast. Fakt on see, et ühe projektiga hõivatuse tõttu olin sunnitud mõneks ajaks blogi uuendamisest loobuma ja jäin graafikust mõnevõrra maas. Nüüd on aga kõik läbi ja loodan ka edaspidi sama rütmi hoida ja regulaarselt värskeid materjale hankida.

Nüüd pöördun tagasi kavandatud teema juurde. html-i põhitõdede sissejuhatuse raames kirjutasin juba html-dokumentide ülesehitusest, kus andsin selgitusi ka peamiste html-i, pea- ja body-märgendite kohta, mis peavad olema igas dokumendis, aga ka spetsiaalse sildi kohta.nimetatakse deklaratsiooniks.

See jaotis sisaldab ka teavet loendi koostamise funktsiooni kasutamise kohta. Lisaks sai tutvuda saidil olevate vormidega ja eraldi siltidega, mis võimaldavad kujundada väga erinevaid vorme: .

Olles saanud Teilt, kallid lugejad, tagasisidevormi ja e-kirja teel palju soove, otsustasin minna tagasi algusesse ja uurida täpsemalt, millised sildid eksisteerivad, kuidas neid klassifitseeritakse ja millised on html-siltide atribuudid. . Niisiis, alustame.

Paaris- ja üksik-, plokk- ja rea-HTML-sildid: p, br, hr

Nagu te ilmselt juba varasematest blogipostitustest aru saite, on silt hüperteksti märgistuskeele (HTML) peamine struktuuriüksus. Üldiselt määrab see siltide komplekt html-koodi, mis kirjeldab konkreetset dokumenti (näiteks ühte teie ressursi lehte).

Sildid liigitatakse paarideks ja üksikuteks, samuti plokk- ja joonemärgisteks. Nüüd vaatame järjekorras nende erinevuste olemust, kasutades kõige populaarsemate ja sagedamini kasutatavate siltide näidet. Muide, paljudest allikatest leiate ploki- ja tekstisiseste elementide nimed, teadke, et need on samad.

Alustuseks annan lühikesed määratlused. Seotud html-sildid- elemendid, millel on avamis- ja sulgemärgendid, mille vahel sisu asub; üksikutel elementidel ei ole sulgevat silti. Plokielemendid on need, mis hõivavad kogu saadaoleva laiuse; selle kõrguse määrab sisu. Seetõttu asuvad vaikimisi mitu ploki elementi üksteise all.


Plokielemente saab üksteise sisse pesastada, kuid mitte kõiki, sellest lähemalt hiljem. Tekstisisesed sildid sisaldavad tavaliselt teksti või muid tekstisiseseid elemente, kuid tekstisiseste siltide sisse ei ole lubatud paigutada plokkmärgendeid. Tekstisisesed sildid paiknevad erinevalt plokk-siltidest ühel real ja kantakse teisele üle vaid vajadusel, kui saadaolev laiusruum otsa saab.


Tõenäoliselt on see algajatele veel veidi keeruline ja peas on segadus, kuid see on hea algus. Edaspidi saab kõik selgemaks, olen selles veendunud. Veelgi enam, ma liigun edasi konkreetsete näidete juurde, mis põhinevad ühistel siltidel, märkides iga kord, millistele elementidele, kas sees või plokk, paaris või üksik, igaüks neist kuulub.

Alustame märgendist p, mida iga veebimeister sõna otseses mõttes iga minut kasutab, ma ei liialda. Selle elemendi nimi pärineb ingliskeelse sõna paragrahv algustähest (lõik, lõik). Selle eesmärk on tõsta esile tekstifragmente, mis on seega lugejatel palju kergemini tajutavad. Näiteks praegu kirjutan ma artiklit ja tõstan postituse teksti aeg-ajalt lõikudeks esile, näete seda.

Jagades teksti fragmentideks ja muutes ressursi külastajatel materjali võimalikult hõlpsaks tajumiseks, saate oluliselt parandada otsingumootorite ressurssi, mis on selle reklaamimisel oluline.

Oma tuumas on p-element loomulikult paaris, kuna sellel on avamis- ja sulgemärgend. Samal ajal on see plokkelement, mis võib sisaldada ainult sisemisi elemente. Näiteks kui kirjutada mingi tekst mitmele reale ja panna see ava- ja sulgemismärgiste vahele, siis brauser kuvab selle ikkagi ühel real ja ainult juhul, kui tekst ühele reale ei mahu, kantakse see üle.

HTML sildid Silt p - ploki element Sildi p sisu

Kuid selle teksti mitmes reas kuvamiseks peate kasutama elementi br (inglise keelest "break"), mis on üksik, see tähendab, et sellel pole sulgevat silti ja see on ka sisemine element. Asetades selle iga tekstirea lõppu, mis on märgendi p sisu, saame soovitud valiku:

HTML sildid
Silt p – ploki element
P-sildi sisu

Br-märgendite kirjutamine on peaaegu tasuta. See tähendab, et saate valida mitu rida korraga ja panna selle sildi nende kõigi lõppu või lihtsalt kirjutada teksti tavalisel viisil ja sisestada br kohtadesse, kus oletatavad sidekriipsud peaksid olema. Plokisildi p sisus olevate tekstisiseste elementide br arv võib olla nii suur, kui soovitakse. See tähendab, et uuele reale saab kirjutada nii palju teksti, kui soovite.

Nüüd vaatame veel ühte lihtsat silti, millest räägime üksikasjalikumalt artikli lõpus. Me räägime hr-sildist (inglise keelest "horisontaalne reegel"- horisontaaljoon), mis on üksik, kuid samal ajal plokk, kuna vaikimisi hõivab see kogu võimaliku laiuse. See kirjeldab lihtsat horisontaalset joont, mis on kasulik lehe sisu jagamisel loogilisteks osadeks. See võib olla teksti, pildirühmade või mõne muu kujunduskomponendi eraldamine.

Selle horisontaalse joone välimus sõltub brauserist, milles lehte vaadatakse, mille html-kood seda elementi sisaldab. Lisaks saab selle rea välimust, nagu ka teiste elementide välimust, redigeerida mitmesuguste atribuutide abil. Nüüd oleme sujuvalt lähenenud meie tänase teema teisele komponendile, nimelt html-sildi atribuutide kontseptsioonile.

HTML-märgendite atribuudid ja nende klassifikatsioon

HTML-märgendite atribuudid võimaldavad teil anda neile täiendavaid omadusi ja mitmekesistada brauseris kuvatavate veebilehe elementide välimust. Igal sildil võib olla mitu atribuuti. Igaüks neist mängib rolli veebisaidi lehe konkreetse ala kujunduse kujundamisel. Atribuudid kirjutatakse avasildi sisse elemendi enda nime järele. Kui atribuute on mitu, pole nende järjekord oluline, see võib olla ükskõik milline.

Peaaegu igal atribuudil on oma väärtus (parameeter). Üldiselt saab iga üksiku või paarismärgise skemaatiliselt kujutada järgmiselt:


Pange tähele, et atribuudi väärtuse märkimiseks tuleks atribuutide nimede järele panna võrdusmärk ja väärtus ise ühe- või topeltjutumärkides. Atribuudid võivad esineda nii tekstisiseses kui ka plokitüübis; nii üksik- kui ka paarismängu siltides.

Loomulikult ei ole ühe elemendi puhul sulgevat silti. Kõik atribuudid ja nende väärtused on kirjutatud avasildi sisse ja need tuleb eraldada tühikuga, vastasel juhul ei kuvata brauseris vastavat ala õigesti. Jah, ma oleks peaaegu unustanud, mõnel atribuudil ei pruugi olla väärtusi. Loomulikult on võimatu kõiki silte koos kõigi võimalike atribuutidega sõeluda ja see pole oluline, peamine on mõista nende kasutamise mehhanismi. Ametlikul lehel saate uurida kõiki soovitatud html-silte.

Tõsi, on andmeid, mis vastavad ametlikult kehtivatele html 4.01 standarditele. Kiires tempos toimub aga versiooni html 5 juurutamine, mille reegleid järgivad juba populaarsed brauserid. Ja hüperteksti märgistuskeele uues versioonis ei kehti mõned sildid ja atribuudid enam, see tähendab, et need ei vasta HTML-i standarditele. Seetõttu käime ajaga kaasas ja edaspidi pakun teile ainult kehtivaid silte ja atribuute, samuti õpime edaspidi vältima HTML koodi standarditele mittevastavust, selleteemalised materjalid ilmuvad õige pea.

Kuid heidame pilgu W3C ametlikule lehele, kus on esitatud soovitatavate html-siltide tabel. Kui klõpsame meid huvitava sildiga lingil (selguse huvides võtame juba mainitud hr-märgise, eriti kuna käsitleme allpool ühte näidet), siis suunatakse meid sellele veebilehele, kus spetsifikatsioon selle elemendi kohta on antud:


Kõik elemendi atribuudid võib jagada kolme rühma:

  1. Universaalne atribuutide rühm- need kehtivad peaaegu kõigi html-märgendite kohta. Ülaltoodud ekraanipildil on need rohelise raamiga esile tõstetud
  2. Unikaalsed atribuudid- selle elemendi jaoks ainulaadsete atribuutide komplekt (joonisel oleva hr-sildi puhul on need lillaga alla joonitud: joondus, varjund, suurus, laius). HTML 5 spetsifikatsioon lisas uue värviatribuudi, mis määrab horisontaaljoone värvi.
  3. Sündmused- neid atribuute on vaja siis, kui kasutaja toimingule on vaja mingit toimingut. Ekraanipildil on need sinise raamiga esile tõstetud.

Teavet atribuutide kohta saab ka teiselt W3C lehelt, kus on tabel täieliku html-atribuutide loendiga:


See tabel näitab kõiki hüperteksti märgistuskeeles olemasolevate siltide atribuute. Soovitud atribuudi vastas asuvas veerus "Seotud elemendid" on märgitud sildid, milles seda atribuuti kasutada saab. Veerg "Tüüp" näitab andmete tüüpi, mida saab kasutada atribuudi väärtusena. Näiteks joondusatribuudil (mis määrab elemendi joonduse) on kolm võimalikku väärtust (vasakul, keskel, paremal).

Kui veerus "Osakond" on D-täht, ei ole seda atribuuti soovitatav kasutada, vastasel juhul ei läbi html-dokument valideerimist. Sel juhul on vaja kasutada CSS-i stiile, mida, nagu juba märkisin, lähitulevikus uurime. See on vajalik, kuna suundumus on, et enamik HTML 5 atribuute on aegunud ja elementide välimus tuleks määrata css-i abil.

Muide, täiesti täielik teave lisatud siltide ja nende atribuutidega vastavalt versioonile html 5 on esitatud minu arvates ühel parimal HTML-i põhitõdede õppimisele pühendatud allikal, nimelt htmlbookis, ja vene keeles.

Horisontaalse joone kuvamine märgendi hr abil

Me tegutseme järk-järgult. hr element atribuutideta määratleb lihtsa horisontaalse joone, mis võtab enda alla kogu ruumi laiuse (vt ülaltoodud näidet). Rakendades hr-sildile järjestikku erinevaid atribuute, muudame horisontaalse joone välimust.

Esmalt kirjutame joonduse ja laiuse atribuudid. Mis puutub joondusse, siis seda on mõtet kasutada ainult siis, kui on määratud atribuut width, mis määrab elemendi laiuse (vähem kui lehe laius). Lubage mul teile meelde tuletada, et silt hr on plokkelement ja võtab vaikimisi kogu saadaoleva laiuse ruumi.

Laiuse atribuudi väärtus võib olla kas numbrid (sel juhul määratakse laius pikslites) või protsendid, mis määravad elemendi laiuse murdosa saadaolevast ruumist. Atribuudi suurus väärtus sisestatakse numbritega ja see määrab elemendi kõrguse (antud juhul horisontaaljoone paksuse). Nii et vaatame näidet:

Järgmisena lisage ülaltoodule atribuut noshade. Fakt on see, et hr-märgise kasutamisel kasutatakse vaikimisi 3D-efekte (varju), näete ülaltoodud joont vaadates. Atribuudi noshade määramisega keelame sellega nende kasutamise.

Nüüd proovime lisada värviatribuuti, mis määrab horisontaaljoone värvi. Pange tähele, et selle atribuudi kasutamine keelab automaatselt 3D-efektid, seega pole varjundit vaja. Väärtuseks määrame värvi nimetuse, näiteks “sinine”.

Niisiis, kasutades konkreetset näidet p, br, hr, vaatasime, kuidas html-sildid ja ka erinevad kasutatavad atribuudid mõjutavad erinevate elementide moodustamist veebilehel. Avaldan peagi sellele teemale jätku, nii et uute materjalide saamiseks ärge unustage tellida ajaveebi värskendusi RSS-kanali või meili teel. Seetõttu lubage mul minna puhkusele parimate soovidega.

HTML-sildid on standardne märgistuskeel, mis on mõeldud ülemaailmse Interneti dokumentide jaoks. Tänu temale loodi kõik World Wide Web lehed. Kui vaatate praegu avatud lehe koodi, näete tohutul hulgal tähe- ja numbrimärke – need on HTML-i sildid. Mõned neist on eriti olulised veebisaitide otsingumootoritele optimeerimisel.

Mis on pealkirjasildid?

Pealkirjasiltidel on kõige suurem mõju veebilehel oleva märksõna kaalule. Brauser kuvab artikli pealkirja, mis muudab märgendi otsingumootori optimeerimise oluliseks elemendiks. Tähelepanu äratamiseks tuleks artiklite pealkirjad kirjutada keskmisele inimesele arusaadavas keeles ja sisaldama piisavalt teavet. Märgendi paremaks toimimiseks väärtuses < pealkiri > peab sisaldama vähemalt 7 sõna. Kui seda reeglit järgite, on teil võimalus saada otsingumootoritelt täiendavat liiklust. Ja lõpuks, pealkiri peaks olema võimalikult lähedane artikli teemale.

Mis on vaatamissildid< h1>,< h2>…< h6>?

Sellised sildid on tekstipealkirjad, mis asuvad otse siltide sees: Saidi paremaks toimimiseks märgend

- mitte rohkem kui viis korda. Sildid lehtede vormindamiseks ja struktureerimiseks

-

kasutatud vajalikus koguses, kuid proovige seda teha

Mis on sildid< meta>?

Kaks metasilti on SEO jaoks väga olulised: kirjeldus ja märksõnad. Neid lehel ei kuvata, kuid otsingumootorid võtavad neid arvesse. Algselt loodi märksõnad, et muuta dokumendi semantika otsingumootoritele paremini arusaadavaks. Nüüd sisestatakse sellesse märgendisse sõnad, mis peegeldavad Interneti-lehe olemust.

Mis puudutab kirjeldusmärgendit, siis varem sisestati sinna suur hulk sõnu, mis mõjutas paremusjärjestust. Yandexi otsingumootor genereerib selle sildi väärtuste põhjal väljavõtteid. Tänapäeval on paljud kindlad, et kirjeldust pole üldse vaja, kuid optimeerijad soovitavad selle siiski ära täita. Igal juhul ei tee see halba.

Mis on sildid< tugev>,< b> ja< em> ?

Märgi funktsioon - tõstke lehel olev tekst paksus kirjas esile. See ilmus veidi hiljem kui silt , kuid vaatamata sellele arvestavad seda ka otsingumootorid. Märksõnade tuvastamiseks ja nende tähenduse tugevdamiseks soovitavad reklaamieksperdid kasutada esiletõstmise silte , .

Sildid , Tõsta nende vahele kirjutatud sõnad kaldkirja. Otsingumootorite jaoks on neil vähe tähtsust, kuid nende kasutamine avaldab Interneti-lehele positiivset mõju.

on silt, mille ülesanne on alla joonida tekstiosasid, mis on olemuselt informatiivsed. Selle mõju otsingule on tähtsusetu, seda kasutatakse pigem lehe kujunduse ilmekamaks muutmiseks.

Mis on sildid< img>?

Interneti-lehtedel saadaolevad pildid kuvatakse neil sildi abil . Sellel on palju atribuute, kuid otsingumootorite jaoks on kõige olulisemad alt ja title. Esimene neist on oma olemuselt informatiivne ja kuvatakse juhul, kui pilti pole võimalik avada, ja teine ​​sisaldab pildi nime. See ilmub brauseris, kui hõljutate kursorit pildi kohal. Mõlemad atribuudid on üsna olulised nii külastajate kui ka otsingumootorite jaoks (suuremal määral), kuid paljud veebimeistrid jätavad need teenimatult tähelepanuta.

Silte kasutatakse kõige sagedamini HTML-lehtede redigeerimisel – tänu neile jagatakse tekst lõikudeks. Erinevate siltide õige kasutamine mitte ainult ei aita teie saiti otsingumootorites reklaamida, vaid muudab selle ka külastajate jaoks atraktiivsemaks.

on kõige levinumad, kuna need mõjutavad märksõna kaalu internetilehel. Seega kuvatakse brauseris artikli pealkiri, mis muudab pealkirja otsingumootori vajalikuks osaks. Enamasti on artiklite pealkirjad kirjutatud tavainimesele arusaadavas keeles ja peaksid sisaldama piisavalt teavet, et tähelepanu äratada. Märgendi parimaks toimimiseks peab pealkirja väärtus sisaldama vähemalt 7 sõna. Kui seda reeglit järgite, on teil võimalus saada otsingumootoritelt täiendavat liiklust. Ja lõpuks, pealkiri peaks olema võimalikult lähedane artikli teemale.

Mis on vaatamissildid

,

…

?

Sellised sildid on tekstipealkirjad, mis asuvad otse saidi lehel ja asuvad teiste siltide sees …

. Saidi parema toimivuse märgend

Soovitatav on kasutada ainult 1 kord, ja

- mitte rohkem kui 5 korda. Kuid lehtede vormindamiseks ja struktureerimiseks peaksite kasutama silte

-

mõistlikus koguses.

Mis on sildid ?

SEO-s töötamiseks kasutatakse kõige sagedamini kahte metasilti: kirjeldus ja märksõnad. Neid lehel ei kuvata, kuid otsingumootorid võtavad neid arvesse. Algselt loodi märksõnad, et otsingumootoritel oleks lihtsam dokumendi semantikast aru saada. Nüüd on sellesse märgendisse sisestatud sõnad, mis peegeldavad Interneti-lehe olemust.

Mis puudutab kirjeldusmärgendit, siis varem sisestati sinna suur hulk sõnu, mis mõjutas paremusjärjestust. Yandexi otsingumootor genereerib selle sildi väärtuste põhjal väljavõtteid. Tänapäeval on enamik inimesi kindlad, et kirjeldust pole üldse vaja, kuid programmeerijad soovitavad seda kasutada. Igal juhul kahju sellest ei tule.

Mis on sildid , , Ja ?

Tag - on vormindamine, selle ülesanne on muuta lehel olev tekst paksuks. See silt ilmus veidi hiljem kui b silt, kuid vaatamata sellele arvestavad seda ka otsingumootorid. Märksõnade tuvastamiseks ja tugevdamiseks soovitavad reklaamieksperdid kasutada esiletõstmise silte.

- vormistab sinna sisestatud sõna, kirjutades selle kaldkirja. Otsingumootorite jaoks on sellel vähe tähtsust, kuid selle kasutamine avaldab Interneti-lehele positiivset mõju.

on silt, mida kasutatakse ka vormindamisel, kuid selle funktsioon on informatiivsete tekstiosade alla joonimine. Selle sildi mõju otsingule ei ole märkimisväärne, seda kasutatakse sagedamini ilu jaoks.

Mis on sildid ?

Lehekülgedel kuvatavad pildid teevad seda sildi abil . Sellel sildil on palju atribuute, kuid otsingumootorite jaoks on kõige olulisemad alt ja title. Alt - on olemuselt informatiivne ja pealkiri sisaldab pildi nime, mis võib olla

HTML-lehtede redigeerimisel kõige sagedamini kasutatav silt on aga

See on populaarne viis lõigete eraldamiseks. Igal juhul suurendab igasugune siltide kasutamine teie saidi populaarsust otsingumootorite seas. Kasutage neid kindlasti ja liikuge edasi.

Tere, kallid ajaveebisaidi lugejad. Täna hakkame rääkima HTML-keeles siltidest, nimelt pealkirjadest H1, H2, H3, H4, H5, H6, lõikudest P ja reavahetustest Br, aga ka horisontaalreasildist Hr, mille näitel vaatame atribuutide kasutamist ja vaatame, kust saate teada iga elemendi kõik võimalikud atribuudid ja vaadata nende väärtuste süntaksit.

Peamine erinevus tekstisiseste ja plokkmärgendite vahel on see, et esimesed saavad üksteisele laiuselt järgneda, kuni ruum otsa saab, ja seejärel murravad nad järgmisele reale.

Proovige vaikimisi blokeerida elemente hõivata kogu vaba ruumi laiuses ja seetõttu asub järgmine plokielement tingimata teisel real.

Alustame nüüd kõigi võimalike HTML-i siltide süstemaatilist uurimist ja samal ajal pöörame erilist tähelepanu sellele, mis tüüpi need kuuluvad, et selgelt mõista nende õige (kehtiva) kasutamise võimalusi. Lihtsustatud sildi struktuur näeb välja järgmine:

Nende jaoks on ka atribuudid (igaühel on oma komplekt), mis võimaldavad lisada sellele elemendile teatud atribuute, kuid sellest räägime konkreetsete näidete abil.

Hakkame vaatlema pealkirjade mõistet, mis moodustatakse paarismärgendite H1, H2, H3, H4, H5, H6 abil (nimi tuleb sõna “Päis”, s.o “pealkiri”) esimesest tähest. Need on mõeldud erinevate tekstifragmentide üksteisest eraldamiseks ja nende tähtsuse märgistamiseks olenevalt tasemest. HTML-keele kaasaegses versioonis on kõik sildid ja kõik neile lubatud atribuudid eelnevalt määratud ja kirjeldatud.

Seetõttu saab pealkirjadel olla ainult kuus taset ja lisaks elemente H1-H6 on blokeeritud, st. püüdke hõivata kogu lehe laiuse vaba ruumi. Kuid neil on üks eripära – päisemärgendite sees võivad olla ainult tekstisisesed elemendid, hoolimata asjaolust, et näiteks sama Div võimaldab lisada selle sisse ka teisi plokkmärgendeid.

See. brauser ei luba sul näiteks ühe taseme päiste sisse lisada teise taseme päiseid, sest kordan, need on plokkelemendid, aga need võivad sisaldada ainult väiketähti. Oi kuidas.

Erineva suurusega H1-H6 pealkirjad joonistatakse brauserites erineva suurusega fontidega (kuigi CSS-i abil saate need brauseris kuvamiseks määrata absoluutselt mis tahes suuruse, värvi ja fonditüübi, kuid puhtas HTML-is on need reeglid) :

Kui arvestada saidi paigutust selle edasise reklaamimise mugavuse seisukohast (), siis tasub mainida, et seal peaks olema ainult üks H1-taseme pealkiri lehekülje kohta. Tõenäoliselt võite kasutada kahte H1-d, kuid rohkem kui see põhjustab tõenäoliselt teie dokumendi otsimisel otsingumootorite negatiivse reaktsiooni. Teie tegevust võidakse pidada rämpspostiks või asjakohasust suurendavaks.

Samuti ei ole soovitatav vahele jätta pealkirja tasemeid, s.t. Pärast H1 tuleks kasutada H2, et esile tõsta vähem olulisi tekstilõike jne. On ebatõenäoline, et see toob kaasa tõsiseid sanktsioone otsingumootoritelt, kuid siiski on parem järgida HTML-koodi pealkirjatasemete loomise loogikat.

Otsingumootorid omistavad nendes siltides sisalduvatele sõnadele rohkem tähtsust kui ainult tekstis olevaid sõnu. Järeldus on, et artiklite kirjutamisel tuleks kindlasti lisada kasutatavatele pealkirjad.

Noh, juba pealkirjade kasutamine artikli tekstis muudab selle visuaalsemaks ja aitab lugejatel teabes kiiresti navigeerida. Ma arvan, et esimest korda on piisavalt teavet ja on aeg edasi liikuda.

Lõige, reavahetus ja horisontaalne rida HR HTML-koodis

Märgis P on tuletatud sõnast "lõik", kuid sagedamini nimetatakse seda siiski lõiguks. Neid kasutatakse teatud tekstiosa semantiliseks esiletõstmiseks, mis tavaliselt sisaldab mitut lauset. P-elementidest vertikaalselt moodustatud lõikude vahele tekib tühi ruum, mis võimaldab eraldi loogilised tekstitükid visuaalselt üksteisest.

Asi on selles, et inimesel on teksti monoliiti üsna raske lugeda, kui see pole eraldi väikesteks kildudeks purustatud. Näiteks ma ei hakka üldiselt isegi lugema artikleid, mis pole HTML-koodis lõikudeks jaotatud, sest see on väga tüütu.

Teksti murdes oled väga vähendada väsimusläve teie ressursi külastajaid ja parandada kasutajategureid (kasutaja teie saidil veedetud aeg ja), mis omakorda avaldavad reklaamile positiivset mõju.

Samadel eesmärkidel (kasutajate tähelepanu hoidmiseks ja artikli lugemisel väsimuse vähendamiseks) lisatakse teksti mitmesuguseid ja mõnikord võib-olla ka neid.

Muide, lõigumärgend P, nagu te ilmselt juba märkasite, on paar, kuid HyperText Markup Language 4.01 spetsifikatsiooni kohaselt on selle sulgev element täielikult pole nõutud. Sel juhul peab brauser välja mõtlema, kuhu see paigutada.

Kuna P on plokkelement ja selle sees võivad esineda ainult väiketähed. Järelikult analüüsib brauser, tuvastanud avalõigu märgendi, koodi edasi ja niipea, kui ta kohtab järgmist plokielementi (tõenäoliselt on see järgmine avav P), lisab ta kohe sulgeva lõigu märgendi ette. Html 5 standardis selliseid vabadusi tõenäoliselt enam ei eksisteeri ja neid on vaja kohe harjuge kõigi siltide sulgemisega ja kirjutage need ainult väiketähtedega.

Lõik on plokielement, nii et lõikude sees olev tekst kipub hõivama kogu saadaoleva laiusega ruumi. See tähendab, et kui kirjutasite dokumendi Html-koodi nii, nagu see peaks olema (iga rida eraldi) ja panite kogu selle nelinurka lõigumärgenditesse P, näete brauseris, et kõik teie neli rida liidetakse üks ja see hõivab kogu teksti jaoks saadaoleva ruumi laiuse.

Oleme juba artiklis üksikasjalikult arutanud, miks see nii juhtub. Tänu sellele hüperteksti märgistuskeele omadusele (et suvaline arv tühikuid lähtekoodis asendatakse brauseris kuvamisel ühe tühikuga) saate oma koodi vormindada mis tahes mugaval viisil, kartmata selle kuvamist häirida. veebileht.

Noh, kui teil on tõesti vaja kirjutada nelinurk üldtunnustatud kujul, saate selleks kasutada täiendavat HTML-i

reavahetuse sildid nimega BR

(sõnast "break"):

BR on inline element ja ka “tühi”, st. ühekordne (sulgurelement puudub). BR-i kogu funktsioon seisneb selles, et see põhjustab brauseris teksti kuvamisel reavahetuse (sarnaselt sisestusklahvile igas tekstiredaktoris).

BR (reavahetus) siltide kirjutamine koodis ei ole kuidagi reguleeritud. Võid kirjutada kogu teksti kokku ja panna õigetesse kohtadesse tühikute asemel BR või siis selguse huvides koodis teksti kohe ridadeks jaotada ja panna BR kas ridade lõppu või algusesse. See ei muuda olemust.

HR(lühend sõnadest “horisontaalne reegel”, st horisontaaljoon) on väga lihtne HTML-i silt, mis tõmbab horisontaalse joone (triibu) üle kogu ekraani laiuse ja paksuse, olenevalt brauserist, milles seda vaadatakse (sisuliselt see on visuaalne marker, mis analoogselt pealkirjasiltidega võimaldab teksti hõlpsamaks assimilatsiooniks loogilisteks tükkideks jagada).

See on “tühi” (üksik), st. ei oma paari (sulgev silt). Pealegi, HR on plokkelement, st. see võtab vaikimisi kogu talle saadaoleva lehe laiuse.

Atribuutide mõiste ja reeglid nende kirjutamiseks HTML-märgenditesse

Vaatame selle lihtsa elemendi abil atribuudi mõistet. Fakt on see, et saame lisada siltidele atribuute, mis kehtivad ja mida on WC3 validaatoris kirjeldatud, andes seeläbi sisule vajaliku omaduse.

Näiteks kui teil on mitu lõiku (lõike) reas, mis on ümbritsetud vastavate P-märgenditega, siis ühe neist välimuse muutmiseks peate lihtsalt lisama selle lõigu avatavale P-elemendile vajalikud atribuudid. Üksikute (tühjade) siltide puhul pole valikuid, kuhu vajalik atribuut lisada.

Niisiis, esimene reegel on atribuudid paigutatakse ainult avamärgendisse(lõpuv ei sisalda kunagi midagi). Üks element võib sisaldada mitut atribuuti, mis on üksteisest ja sildi nime vahel tühikuga eraldatud (kohustuslik tingimus). Toon kohe näite nende kasutamisest HR-i horisontaaljoone jaoks:

Nii et kõigepealt vaatame üle atribuudi süntaksi. Need sisestatakse avamärgendisse, eraldatuna tühikuga (sealhulgas tühik pärast elemendi nime) ja need on konstruktsioon, mis sisaldab nime, võrdusmärki ja kirjutatakse jutumärkidesse (tavaliselt on kombeks panna paaris topised , kuid standard lubab ka paaris üksikute jutumärkidega) väärtusi. Atribuutide järjekord HTML-märgendi koodis ei ole oluline.

Seal andsin lingi kõigi kehtivate HTML-märgendite loend. Kui klõpsate selles loendis teid huvitava elemendi nimel (meie puhul on see HR), suunatakse teid lehele, kus on selle üksikasjalik kirjeldus:

Kõik mis tahes sildi atribuudid võivad olla jagada kolme rühma:

  1. Üldine – need võivad esineda enamikus HTML-keele elementides. Ülaloleval pildil on need allosas ja ümbritsetud punase raamiga. Tegelikult on tavalisi atribuute vähe (ainult kuus) ja isegi siis ei kasuta te tõenäoliselt neid kõiki oma praktikas. Tõenäoliselt on ainult neli - , pealkiri ja stiil.
  2. Sündmuse atribuudid – need on vajalikud mõne toimingu käivitamiseks vastuseks kasutaja toimingule või süsteemisündmusele. Need on rohkem seotud JavaScreetiga ja ülaloleval joonisel on kõige allosas (tumedas raamis ringis).
  3. Unikaalne – igal sildil on tavaliselt oma atribuutide komplekt, millest mõnda ei pruugi teistel elementidel üldse leida. Kui arvestada HR-i horisontaaljoont, on sellel ainult neli ainulaadset atribuuti (joondus, varjund, suurus ja laius). Brauser ignoreerib kõiki teisi HR-i märgendis määratud (välja arvatud kaks ülalkirjeldatud rühma).

Näited atribuutidest HR horisontaalse joone sildis

Erinevate atribuutide väärtused võivad olla kas suvalised arvud (jne) või väärtused etteantud komplektist, näiteks HR - vasak|tsenter|paremale joondamise puhul (saate kasutada ühte kolmest joondusest valikud).

Üldiselt saab nende kohta WC3 validaatoris teavet mitte ainult HTML-siltide loendist, vaid ka atribuutide loend, mille leiate lisatud lingilt.

See loend sisaldab kõiki võimalikke valikuid kõigi HTML-keeles saadaolevate siltide jaoks. Teid huvitava valiku vastas olev veerg „Seotud elemendid” loetleb elemendid, milles seda atribuuti kasutada saab. Veerg „Tüüp” näitab andmete tüüpi, mida saab selle väärtusena kasutada.

Näiteks joonisel joondamise atribuudi puhul allajoonitud real on HR-sildi puhul lubatud kasutada ainult kolme fikseeritud väärtust, mis on seal loetletud (vasakul | keskel | paremal).

Teine väga oluline veerg on “Depr”. Kui selles veerus teid huvitava atribuudi kõrval on D-täht, siis see kasutamine ei ole soovitatav, kuid selle asendamiseks peaksite kasutama sobivaid CSS-i stiile. Sildi spetsifikatsiooni vaatamisel nägime ka, et kõigi nelja HR-i atribuudi nimede kõrvale oli kirjutatud sõna “Deprecated” (ei ole soovitatav kasutada).

Vaatame, milliseid atribuute kasutatakse elementidega, mida oleme selles artiklis juba käsitlenud (P, pealkirjad H1-H6 ja HR). Kõigi nende jaoks võite kasutada "joondamist", sest kõik need elemendid on plokkelemendid. Tekstisiseste elementide puhul pole atribuudil "joondamine" tähendust.

Näiteks kui lisate pealkirjasildile (nt H1) sõna "joondamine", saate määrata pealkirja teksti joonduse. Need. Plokielement hõivab kogu selle laiuse ruumi, kuid selle päise sisu (selle teksti) saab joondada kas vasakule (vaikimisi), paremale või keskele või laiusele (õigusta - sõnade vaheline kaugus muutub, nagu ajaleheveergudel).

Muide, sama kehtib ka lõigu P HTML-sildi ja Div konteineri kohta, kui vaadata antud ekraanipilti hoolikalt.

Horisontaalse HR-joone puhul näitab atribuut "joondamine" selle elemendi poolt moodustatud horisontaaljoone enda joondamist. Kuid HR-i silt on plokkelement ja kipub laiuses hõivama kogu olemasoleva ruumi. Seetõttu on selles "joondamist" mõtet kasutada ainult siis, kui koos sellega ka teie määrake atribuudi "laius" väärtus(laius) väiksem kui lehe laius.

"Width" väärtus võib olla lihtsalt numbrid (see määrab laiuse pikslites) või võite kasutada horisontaalse HR-joone kogulaiuse protsenti. Sama sildi atribuudi “size” väärtus on määratud numbritega, mis näitavad horisontaaljoone kõrgust pikslites. Vaatame seda näitega:

Html 4.01 standardi HR-sildil on veel üks atribuut nimega single, sest see ei saa võtta mingeid väärtusi (see tähendab lihtsalt mingit toimingut) – see on varjund, mis takistab horisontaalsel joonel varju heitmast:

On selge, et ma ei saa HTML-is kõigi võimalike siltide kõiki võimalikke atribuute arvesse võtta ja seda pole vaja, sest kõike saab teha analoogia põhjal - peamine on mõista süntaksit ja ideed ise. Lisaks on paljud neist muutunud juba kasutuskõlbmatuks, sest... Nüüd nende funktsiooni täidavad CSS-stiilid, millest hakkame peagi ka üksikasjalikult rääkima.

Edu sulle! Kohtumiseni ajaveebisaidi lehtedel

Võib-olla olete huvitatud

Html-vormingus tabelid – tabeli-, Tr- ja Td-sildid, samuti Colspan, Cellpadding, Cellspacing ja Rowspan nende loomiseks
Iframe ja Frame – mis need on ja kuidas raame HTML-is kõige paremini kasutada
Kommentaaride juhised ja Doctype HTML-koodis, samuti ploki- ja tekstisiseste elementide (siltide) kontseptsioon
Embed and object – HTML-sildid meediumisisu (video, flash, heli) kuvamiseks veebilehtedel
Kuidas lisada linki ja pilti (fotot) HTML-i – IMG ja A sildid
Saidi HTML-vormid – veebivormi elementide loomiseks sildid Vorm, Sisend ja Vali, Valik, Tekstiala, Silt ja muud
Font (nägu, suurus ja värv), Blockquote ja eelsildid – pärandteksti vormindamine puhtas HTML-is (CSS-i ei kasutata)
Tühikumärgid ja nende koodi vormindamine HTML-is, samuti spetsiaalsed mittemurdavad tühikud ja muud märgukirjad
Kuidas luua hüperlinki (A, Href, Target tühi), kuidas seda saidi uues aknas avada ja ka pilt HTML-koodis lingiks teha

Tervitused, sõbrad! Täna räägime sellest lõigu silt ja joonduse atribuut. Üldiselt tuleks kogu lehe sisu jagada lõikudeks. Lõigu sisu kirjutatakse siltide vahele

Tekst…

. Kui kuvame 2 järjestikust lõiku, moodustub nende vahele nähtamatu väli, mis lükkab need üksteisest eemale. Silt on plokksild, nii et see võtab enda alla kogu lehe laiuse.

Näiteks võtame järgmise koodiga lehe:

Lõigetega leht.

Esimene lõik: Lorem Ipsum on lihtsalt trüki- ja trükitööstuse näiv tekst. Lorem Ipsum on olnud tööstusharu standardne näidistekst alates 1500. aastatest, kui tundmatu printer võttis tüübi kambüüsi ja segas selle, et koostada tüübinäidise raamat.

Teine lõik: On ammu tõestatud tõsiasi, et lehe kujundust vaadates häirib lugejat lehe loetav sisu. Lorem Ipsumi kasutamise mõte seisneb selles, et sellel on enam-vähem normaalne tähtede jaotus, erinevalt "Sisu siin, sisu siin" kasutamisest, mistõttu see näeb välja nagu loetav inglise keel.

Vaatame, kuidas see brauseris välja näeb:


Kindlasti märkasite, et lehe koodis on silt tugev, see silt muudab teksti paksuks.

Sildi atribuudid

Iga sildi jaoks saate ja mõnel juhul isegi peate määrama atribuudid. Atribuudi kaudu ütleme brauserile täpselt, kuidas seda või teist elementi lehel kuvada.

Atribuut on määratud avamärgendi sulgudes ja sellel on järgmine süntaks: atribuut_nimi="väärtus"

Joondamise atribuut

Näiteks on meil lehel lõik ja me tahame selle sisu joondada. Selleks kirjutame atribuudi avasildi sisse joondada, mis vastutab sisu joondamise eest lõigu sees, ja määrake sellele üks väärtus.

Lõigu sisu.

Sellel atribuudil on 4 väärtust:

1.Vasakule– Joondab sisu vasakule. See väärtus on vaikeväärtus. See tähendab, et kui me ei määra lõigu atribuuti joondada, siis jäetakse lõigu sees olev sisu vaikimisi joondatud. Seda võib näha eelmises näites.

2. Õige– Joondab sisu paremale.

Tekst…

See näeb brauseris välja järgmine:


3.Kesk- Joondab sisu lehe keskele.

Tekst…


4. Põhjenda– Joondab sisu lehe laiusega.

Tekst…


Tunni kokkuvõte:
Täna saime teada, mis see on lõik html-is. Lõike kasutatakse html-is väga sageli. Saime ka teada, mis on sildi atribuut. Ja õppis ära joondamise atribuudi joondada. Mis võib võtta ühe järgmistest väärtustest: vasak (vaikeväärtus),õige,Keskusõigustada.



Soovitame lugeda