Hvis du ser på HTML markering for hvilken som helst webside i dag, vil du se HTML-elementer som finnes i andre HTML-elementer. Disse elementene som er "innsiden" av andre elementer er kjent som nestede elementer, og de er essensielle for å lage en hvilken som helst webside i dag.
Hva betyr det å hekke HTML-koder?
Den enkleste måten å forstå hekking på er å tenke på HTML-koder som bokser som inneholder innholdet ditt. Innholdet ditt kan inneholde tekst, bilder og relaterte medier. HTML-koder er boksene rundt innholdet. Noen ganger må du plassere bokser inne i andre bokser. Disse "indre" boksene er nestet inne i andre.
Hvis du har en tekstblokk som du vil ha fet skrift i et avsnitt, har du to HTML-elementer så vel som selve teksten.
Eksempel: Dette er en setning i teksten.
Den teksten er det vi vil bruke som eksempel. Slik blir det skrevet i HTML:
Eksempel: Dette er en setning i teksten.
Å lage ordet setning fet, legg til åpnings- og lukkemerker før og etter ordet.
Eksempel: Dette er en setning av tekst.
Som du kan se, har vi en rute (avsnittet) som inneholder setningens innhold, pluss en andre ramme ( sterk tag pair), som gjengir ordet som fet.
Når du hekker tagger, lukker du taggene i motsatt rekkefølge som du åpnet dem. Du åpner
først, etterfulgt av , som betyr at du snur det og lukker og deretter.
En annen måte å tenke på dette er å igjen bruke analogien til bokser. Hvis du plasserer en boks i en annen boks, må du lukke den indre før du kan lukke den ytre eller inneholder boksen.
Legge til flere nestede tagger
Hva om du bare vil ha ett eller to ord fet, og et annet sett for å være kursiv? Slik gjør du det.
Eksempel: Dette er en setning av tekst og den har også noen kursiv tekst også.
Du kan se at vår ytre boks, den
, har nå to nestede koder inne i den og . De må begge være stengt før den inneholder esken kan lukkes.
Eksempel: Dette er en setning av tekst og den har også noen kursiv tekst også.
Dette er et annet avsnitt.
I dette tilfellet har vi bokser inne i bokser! Den ytterste boksen er
eller a. inndeling. Inne i boksen er det et par nestede. avsnittetiketter, og inne i første avsnitt har vi et neste. og tag par.Hvorfor bør du bry deg om hekking
Årsaken nr. 1 til at du bør bry deg om hekking, er om du skal bruke CSS. Cascading Style Sheets stole på at tagger konsekvent blir nestet i dokumentet, slik at det kan fortelle hvor stiler begynner og slutter. Feil hekking gjør det vanskelig for nettleseren å vite hvor disse stilene skal brukes. La oss se på noen HTML:
Eksempel: Dette er en setning av tekst og den har også noen kursiv tekst også.
Dette er et annet avsnitt.
Ved å bruke eksemplet ovenfor, hvis vi ønsket å skrive en CSS-stil som vil påvirke lenken i denne divisjonen, og bare den lenken (i motsetning til andre lenker i andre deler av siden), trenger vi å bruke nestingen til å skrive denne stilen, som sådan:
.hovedinnhold a {
farge: # F00;
}
Andre hensyn
Tilgjengelighet og nettleserkompatibilitet har også betydning. Hvis HTML-en din er nestet feil, vil den ikke være like tilgjengelig for skjermlesere og eldre nettlesere - og den kan til og med ødelegge visuelt utseende på en side hvis nettleserne ikke kan finne ut hvordan de skal gjengi en side på riktig måte fordi HTML-elementer og tagger er ute av plass.
Til slutt, hvis du prøver å skrive helt riktig og gyldig HTML, må du bruke riktig nesting. Ellers vil hver validator flagge HTML-filen din som feil.