Нестинг ХТМЛ Тагс

Како правилно унети ознаке ХТМЛ-а

Ако погледате ХТМЛ ознаку за било коју веб страницу данас, видећете ХТМЛ елементе који се налазе у оквиру других ХТМЛ елемената. Ови елементи који су "изнутра" других су оно што су познате као "угнежени елементи", и од суштинског су значаја за изградњу било које веб странице данас.

Шта значи да гнезди ХТМЛ ознаке?

Најједноставнији начин разумевања гнезда је размишљање о ХТМЛ ознакама као кутије које садрже ваш садржај. Ваш садржај може садржати текст, слике и сл. ХТМЛ ознаке су кутије око садржаја. Понекад морате ставити кутије у друге кутије. Ове "унутрашње" кутије су угнежене унутар других.

Ако имате блок текста који желите крепко у параграфу, имаћете два ХТМЛ елемента, као и сам текст.

Пример: Ово је реченица текста.

Тај текст је оно што ћемо користити као пример. Ево како ће то бити написано.

<п> Пример: Ово је реченица текста.

Зато што желите да слова "реченица" буде крепко, додате отварање и затварање болд ознака пре и после тога.

<п> Пример: Ово је <стронг> реченица текста.

Као што видите, имамо једну кутију (ставку) која садржи садржај / текст наше реченице, плус друго кутије (јак пар ознака), који ће ову ријеч означити болдом.

Када затворите ознаке, веома је важно да затворите ознаке у супротном редоследу који сте их отворили. Прво отворите <п>, а затим <стронг>, што значи да то промените и затворите а затим .

Други начин размишљања о томе је још једном да искористи аналогију кутија. Ако поставите кутију у неку другу кутију, морате затворити унутрашњу, пре него што затворите спољашњу или садржи кутију.

Додавање још уграђених ознака

Шта ако само желите једну или две ријечи бити одважне, а друго да буде курзив? Ево како то учинити.

<п> Пример: Ово је <стронг> реченица текста и такође има и <ем> италицизед тект .

Можете видети да наша спољна кутија, <п>, сада садржи двије угнежене ознаке унутар ње - <стронг> и <ем>. Оба морају бити затворена пре него што се садржај који се налази може затворити.

<див> <п> Пример: Ово је <стронг> реченица текста и такође има и <ем> италицизед тект . <п> Ово је још један пасус.

У овом случају имамо кутије унутар кутија! Најскупља кутија је <див> или "подјела". Унутар ове кутије су пар уграђених ознака пасуса, ау првом пасусу имамо следећи <стронг> и <ем> таг пар. Још једном, погледајте било коју веб страницу данас и видећете ово и много више гнезда! Тако се изграде странице - кутије унутар кутија.

Зашто бисте се требали бринути о гнезди

Први разлог због којег бисте требали бити гнездо јесте да ли ћете користити ЦСС. Цасцадинг Стиле Схеетс се ослањају на ознаке које се непрекидно угнежавају у документу тако да може рећи где се начини почињу и завршавају. Ако подесите стил који би требало да утиче на све "везе које су унутар дељења са класи" маин-цонтент "текста на страници, нетачно гнежење отежава прегледачу да зна где да примењује ове стилове. Погледајмо неки ХТМЛ:

<див цласс = "маин-цонтент"> <п> Пример: Ово је <стронг> реченица текста и такође има и <ем> италицизед тект . <п > Ово је <а хреф="/индек.хтмл"> други став .

Користећи примјер који сам управо рекао, ако бих желео написати ЦСС стил који би утјецао на везу унутар ове подјеле, а само то повезивање (за разлику од других веза у другим дијеловима странице), требао бих користити гнежење да напишем свој стил, као такав:

.маин-цонтент а {цолор: # Ф00; }

Други разлози укључују приступачност и компатибилност претраживача. Ако је ваш ХТМЛ погрешно уграђен, он неће бити доступан читачима екрана и старијим прегледачима - а чак би у потпуности могао да прекине визуелни изглед странице ако претраживачи не могу схватити како правилно правити страницу јер ХТМЛ елементи и ознаке нису на мјесту.

На крају, ако се трудите да напишете потпуно тачан и важећи ХТМЛ, потребно је да користите тачно гнездо. У супротном, сваки валидатор ће означити ХТМЛ као нетачан.