A SECTION elemet egy weboldal vagy egy webhely szemantikus szakaszaként definiálják, amely nem egy másik specifikusabb típus, például ARTICLE vagy ASIDE. A tervezők gyakran használják ezt az elemet, amikor megjelölik az oldal külön szakaszát - egy teljes részt, amelyet áthelyezhetnének és felhasználhatnának más oldalakon vagy a webhely részein. Ez egy különálló tartalom.
Ezzel szemben a DIV elem megfelelő az oldal olyan részeihez, amelyeket fel akar osztani más célokra szemantika. Például becsomagolhat egy tartalmat egy DIV-be, hogy "horgot" adjon a CSS-sel való stílushoz. Lehet, hogy szemantikailag nem egy különálló tartalmi szakasz, de el van különítve, hogy elérje a kívánt elrendezést vagy érzetet.
Ez a szemantikáról szól
Az egyetlen különbség a DIV és a SECTION elemek között a szemantika - a jelentése az általad felosztott tartalom.
A DIV elem bármely tartalmának nincs benne rejlő jelentése. A legjobban használható például:
- CSS stílusok és horgok a CSS stílusokhoz
- Elrendezési konténerek
- JavaScript kampók
- Osztások, amelyek megkönnyítik a tartalom vagy a HTML olvasását
Korábban a DIV elem volt az egyetlen elem, amellyel kampókat lehetett hozzáadni a stílusos dokumentumokhoz és elrendezésekhez. A HTML5 előtt a tipikus weboldal DIV elemekkel volt tele. Valójában néhány WYSIWYG szerkesztő kizárólag a DIV elemet használta, néha a bekezdések helyett.
A HTML5 olyan szakaszolási elemeket vezetett be, amelyek szemantikailag leíróbb dokumentumokat hoztak létre, és segítettek meghatározni a stílusokat ezeken az elemeken.
Mi a helyzet a SPAN-elemmel?
Egy másik gyakori nem szemantikai elem a SPAN. Használták Sorban kampók hozzáadása stílusokhoz és szkriptekhez a tartalomtömbök (általában szöveg) köré. Ebben az értelemben pontosan olyan, mint a DIV, de nem a blokk elem. Gondoljon a DIV-re blokkszintű SPAN-ra, és használja ugyanúgy, de a HTML-tartalom teljes blokkjaira.
A HTML-nek nincs összehasonlítható inline szakaszolási eleme.
Az Internet Explorer régebbi verzióihoz
Még akkor is, ha a Microsoft Internet Explorer drámai módon régebbi verzióit támogatja, amelyek nem ismerik fel megbízhatóan a HTML5-öt, szemantikailag helyes HTML-címkéket kell használnia. A szemantika segít Önnek és csapatának a jövőben kezelni az oldalt. Az Internet Explorer legújabb verziói, valamint annak cseréje, a Microsoft Edge felismeri a HTML5-t.
DIV és SECTION elemek használata
A definícióhoz a DIV és a SECTION elemeket egyaránt együtt használhatja egy érvényes HTML5 dokumentumban - SECTION a tartalom szemantikailag különálló részei és a DIV a CSS, a JavaScript és az elrendezés kampóinak meghatározásához célokra.
Eredeti cikk: Jennifer Krynin. Szerkesztette Jeremy Girard, 2017.03.15.