Aký je rozdiel medzi DIV a SECTION?

Element SECTION je definovaný ako sémantická sekcia webovej stránky alebo webu, ktorá nie je iným konkrétnejším typom, ako napríklad ČLÁNOK alebo ASIDE. Dizajnéri často používajú tento prvok pri označovaní samostatnej časti stránky - celej časti, ktorú je možné presunúť a použiť na iných stránkach alebo častiach webu. Je to zreteľný kus obsahu.

Naproti tomu prvok DIV je vhodný pre časti stránky, ktoré chcete rozdeliť na iné účely ako sémantika. Napríklad môžete zabaliť nejaký obsah do DIV a dať mu „háčik“ na štýl pomocou CSS. Sémanticky to nemusí byť samostatná časť obsahu, ale je to oddelené, aby ste dosiahli požadované rozloženie alebo dojem.

Je to všetko o sémantike

Jediným rozdielom medzi prvkami DIV a SECTION je sémantika - význam obsahu, ktorý rozdeľujete.

Akýkoľvek obsah obsiahnutý v prvku DIV nemá žiadny inherentný význam. Najlepšie sa používa na veci ako:

  • Štýly CSS a háčiky pre štýly CSS
  • Rozloženie kontajnerov
  • Háčiky JavaScript
  • Divízie, ktoré uľahčujú čítanie obsahu alebo HTML
instagram viewer

Prvok DIV býval jediným prvkom, ktorý bol k dispozícii na pridanie háčikov do štýlových dokumentov a rozložení. Pred HTML5 bola typická webová stránka plná prvkov DIV. Niektorí redaktori WYSIWYG v skutočnosti používali výlučne prvok DIV, niekedy namiesto odsekov.

HTML5 predstavil prvky rezu, ktoré vytvorili viac sémanticky popisných dokumentov a pomohli definovať štýly pre tieto prvky.

A čo prvok SPAN?

Ďalším bežným nesémantickým prvkom je SPAN. Je to použité v rade pridať háčiky pre štýly a skripty okolo blokov obsahu (zvyčajne textu). V tomto zmysle je to presne ako s DIV, ale nie je to blokový prvok. Predstavte si DIV ako SPAN na úrovni blokov a použite ho rovnakým spôsobom, ale pre celé bloky obsahu HTML.

HTML nemá žiadny porovnateľný vložený prvok členenia.

Pre staršie verzie prehliadača Internet Explorer

Aj keď výrazne podporujete staršie verzie prehliadača Microsoft Internet Explorer, ktoré spoľahlivo nerozpoznávajú formát HTML5, mali by ste používať sémanticky správne značky HTML. Sémantika pomôže vám a vášmu tímu spravovať stránku v budúcnosti. Najnovšie verzie prehliadača Internet Explorer, ako aj jeho náhrada, Microsoft Edge, rozpoznávajú formát HTML5.

Používanie prvkov DIV a SECTION

Na definovanie môžete použiť prvky DIV aj SECTION v platnom dokumente HTML5 - SECTION sémanticky diskrétne časti obsahu a DIV na definovanie háčikov pre CSS, JavaScript a rozloženie účely.

Pôvodný článok Jennifer Krynin. Upravil Jeremy Girard dňa 15.3.17.