Amikor a HTML5 több éve megjelenik a jelenetre, hozzáadott egy csomó új szelvényelemet a langauge-hoz, beleértve aSZAKASZ elem. A HTML5 új elemeinek többsége egyértelműen használható. Például az elem a cikkek és a weblap főbb részeinek meghatározására szolgál, az elemet olyan kapcsolódó tartalom meghatározására használják, amely nem kritikus az oldal többi részén, és a fejléc, a navigáció és a lábléc eléggé magától értetődő. Az újonnan hozzáadottSZAKASZ Az elem azonban egy kicsit kevésbé világos.
Sokan hiszik a HTML elemeket SZAKASZ és valójában csak ugyanaz a dolog - általános tartályelemek, amelyek tartalmat tartalmaznak egy weboldalon. A valóság azonban az, hogy ez a két elem, bár mindkettő tartályelem, mindentől kezdve általános. Különös oka van annak, hogy mind a SZAKASZ elem és a DIV elem - és ez a cikk megmagyarázza ezeket a különbségeket.
Szekciók és Divs
A SZAKASZ elem egy olyan weboldal vagy webhely szemantikai része, amely nem egy másik konkrétabb típus (például cikk vagy félretétel). Ezt az elemet hajlamosak használni, amikor megjelentem egy külön szakaszot az oldalról - egy olyan szakaszt, amely a nagykereskedelmet áthelyezheti és felhasználhatja a webhely más oldalain vagy részein. Ez egy külön tartalom, vagy egy "szakasz" a tartalom, ha igen.
Ezzel szemben a DIV elemet az oldal azon részeihez, amelyeket fel kíván osztani, de a szemantika kivételével. Én egy olyan területet szeretnék eltakarni egy részlegben, ha pusztán úgy teszek, hogy magamnak egy "horogot" használok a CSS-hez. Lehet, hogy nem egy külön szakasz a tartalom szemantikán alapul, de valamit diktálok annak érdekében, hogy elérjem az általam kívánt elrendezést.
Ez az egész a szemantikáról szól
Ez egy kemény koncepció a megértéshez, de az egyetlen különbség a DIV elem és a SZAKASZ az elem a szemantika. Más szóval, ez az jelentés a felosztott kód szakaszában.
Bármely tartalmat, amely a DIV Az elemnek nincs benne semmi értelme. Leginkább olyan dolgokra használják, mint:
- CSS stílusok és kampók a CSS stílusokhoz
- Elrendezési konténerek
- JavaScript kampók
- A HTML-ben lévő megosztások megkönnyítik az olvasást
A DIV elem volt az egyetlen elem, amit hozzá kellett adnunk a horgokhoz, hogy megformálhassuk a dokumentumainkat, és hozzon létre oszlopokat és díszes elrendezéseket. Emiatt végül HTML-kóddal találkoztunk DIV elemek - mi lehet a webdesignerek "divitis" -nek nevezni? Volt még a WYSIWYG szerkesztők is, akik a DIV kizárólag elem. Igazából a HTML-ben futott, amely a DIV elem a bekezdések helyett!
A HTML5 segítségével elkezdhetjük a szekcionálási elemek használatával több szemantikailag leíró dokumentumot (navigációs és leíró jellegű adatok stb.) Létrehozni, valamint definiálni a stílusokat ezeken az elemeken.
Mi a helyzet a SPAN elemével?
A másik elem, amit a legtöbb ember gondolja, amikor gondolkodnak DIV elem az elem. Ez az elem, tetszik DIV, nem szemantikus elem. Ez egy inline elem, amellyel horogokat adhat a stílusok és szkriptek számára inline tartalomblokkok (általában szöveg) körül. Ebben az értelemben pontosan olyan, mint a DIV elem, csak inline helyett egy blokk elem. Bizonyos szempontok szerint könnyebben lehet gondolni a DIV blokk szinten SPAN elemet, és ugyanúgy használja azt SPAN csak a HTML tartalom teljes tömbjeire.
A HTML5-ben nincs összehasonlítható inline szakaszelem elem.
Az Internet Explorer korábbi verzióihoz
Még akkor is, ha drámai módon támogatja az IE (például IE 8 és alacsonyabb) verzióit, amelyek nem megbízhatóan ismerik a HTML5-öt, nem szabad félnie a szemantikailag helyes HTML címkék használatától. A szemantika segíteni fog Önnek és csapata kezelni az oldalt a jövőben (mert tudni fogja, hogy ez a rész a cikk, ha körülveszi CIKK elem). Ráadásul azok a böngészők, amelyek nem ismerik fel ezeket a címkéket, jobban támogatják őket.
A HTML5 szemantikus szekcionálási elemeket továbbra is használhatja az Internet Explorer programmal, csak szkripteket és esetleg néhány környezetet kell hozzáadnia DIV elemeket, amelyekkel felismeri a címkéket HTML formában.
A DIV és SECTION elemek használata
Ha helyesen használja őket, mindkettőt használhatja DIV és SZAKASZ elemeket egy érvényes HTML5 dokumentumban. Ahogy itt láttál ebben a cikkben, a SZAKASZ elemet a tartalom szemantikailag diszkrét részének definiálásához, és a DIV elemet a CSS és a JavaScript függvényeként, valamint az olyan elrendezést, amely nem rendelkezik semantikus jelentéssel.
Jennifer Krynin eredeti cikke. Szerkesztette Jeremy Girard 15/15/17




