Вгнездени HTML тагови

Како да ги вметнете HTML таг правилно

Ако погледнете во HTML-марка за која било веб-страница денес, ќе видите HTML елементи содржани во другите HTML-елементи. Овие елементи кои се "внатре" на други се она што се познати како "вгнездени елементи", и тие се од суштинско значење за изградба на која било веб-страница денес.

Што значи тоа гнездо HTML тагови?

Најлесен начин да се разбере гнездење е да се мисли на HTML таговите како кутии кои ја држат вашата содржина. Вашата содржина може да вклучува текст, слики, итн. HTML тагови се кутии околу содржината. Понекогаш, треба да поставите кутии внатре во другите кутии. Овие "внатрешни" кутии се вгнездени внатре во другите.

Ако имате блок од текст што сакате да биде задебелен во став, ќе имате два HTML елементи, како и самиот текст.

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

Овој текст е она што ние ќе го користиме како наш пример. Еве како ќе биде напишано.

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

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

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

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

Кога ставате ознаки, важно е да ги затворите ознаките во спротивен редослед што ги отворивте. Прво ја отворите

, а потоа , што значи дека ќе го смените тоа и затворете го , а потоа .

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

Додавање повеќе вгнездени ознаки

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

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

Можете да видите дека нашата надворешна кутија,

, сега има две вгнездени ознаки во неа - и . И двајцата мора да бидат затворени пред да може да се затвори кутијата со содржина.

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

Ова е уште еден став.

Во овој случај имаме кутии внатре во кутии! Најмногу од кутијата е

или "поделба". Внатре во тоа поле има пар вгнездени ознаки на пасусот, а во првиот параграф имаме следниот и таг пар. Уште еднаш, погледнете на која било веб-страница денес и ќе видите ова и многу повеќе гнездење се случува! Така се градат страниците - кутии внатре во кутиите.

Зошто треба да се грижите за гнездење

Првата причина зошто треба да се грижите за гнездење е ако сакате да го користите CSS. Каскадните стилски листови се потпираат на ознаки за да бидат постојано вгнездени во документот, така што може да покаже каде стилите започнуваат и завршуваат. Ако поставите стил кој треба да влијае на сите "врски што се во внатрешноста на поделбата со класа на текст" главна содржина "на страницата, нетолното вгнездување го отежнува прелистувачот да знае каде да ги примени овие стилови. Ајде да погледнеме во некои HTML:

Пример: Ова е реченица на текстот и исто така има и некои курзивни текстови . > Ова е друг став

Користејќи го примерот што го кажав, ако сакав да напишам стил на CSS кој би влијаел на врската во оваа поделба, и само таа врска (наспроти други линкови во другите делови од страната), би требало да го користам гнездење за да го напише мојот стил, како таков:

.main-content a {color: # F00; }

Други причини вклучуваат пристапност и компатибилност на прелистувачот. Ако вашиот HTML е неточно вгнезен, тоа нема да биде достапно за читачи на екрани и постари прелистувачи - и може дури целосно да го скрши визуелниот изглед на страницата ако прелистувачите не можат да сфатат како правилно да ја направат страницата бидејќи HTML елементи и ознаки се надвор од место.

Конечно, ако се обидувате да напишете целосно точен и валиден HTML, ќе треба да користите правилно вгнездени. Инаку, секој валидатор ќе го означи вашиот HTML како неточен.