Kai prieš daugelį metų "HTML5" pasirodo į sceną, jis įtraukė daugybę naujų segmentavimo elementų į "langauge", įskaitant "SKYRIUS elementas Dauguma naujų HTML5 elementų yra aiškiai naudojami. Pavyzdžiui, elementas naudojamas straipsniams ir pagrindinėms interneto puslapio dalims apibrėžti, elementas naudojamas norint apibrėžti susijusį turinį, kuris nėra svarbus likusiam puslapiui, o antraštė, nav ir poraštė yra gana savaime suprantama. Neseniai pridėtaSKYRIUS Tačiau elementas yra šiek tiek mažiau aiškus.
Daugelis žmonių mano, kad HTML elementai SKYRIUS ir tai iš tikrųjų yra tas pats dalykas - bendrieji konteinerių elementai, naudojami turinio turiniui tinklalapyje. Tačiau realybė yra ta, kad šie du elementai, nors ir yra konteinerių elementai, yra nieko bendro pobūdžio. Yra konkrečių priežasčių naudoti abi SKYRIUS elementas ir DIV elementas - ir šis straipsnis paaiškins šiuos skirtumus.
Skyriai ir Divs
The SKYRIUS elementas apibrėžiamas kaip žiniatinklio puslapio ar svetainės semantinis skyrius, kuris nėra kitas konkretesnis tipas (pvz., straipsnis ar atvirkštinė dalis). Aš linkiu naudoti šį elementą, kai pažymiu atskirą puslapio dalį - skyrių, kuris gali būti perkeltas ir naudojamas kitais puslapiais ar svetainės dalimis. Tai yra atskiras turinys arba "turinys", jei norite.
Priešingai, jūs naudojate DIV elementas puslapio dalims, kurias norite suskaidyti, bet ne semantikai. Aš norėčiau apvynioti turinį skyriuje, jei tai darysiu, kad suteikčiau sau "kablys" naudoti su CSS. Tai gali būti ne atskiras turinys, pagrįstas semantika, bet tai, ką aš diktuoja norėdamas pasiekti mano puslapio maketą.
Tai viskas apie semantiką
Tai sunki sąvoka suprasti, tačiau vienintelis skirtumas tarp DIV elementas ir SKYRIUS elementas yra semantika. Kitaip tariant, tai yra prasme kodo dalis, kurią dalijatės.
Bet koks turinys, kuris yra " DIV elementas neturi savitos reikšmės. Tai geriausia naudoti tokiems daiktams kaip:
- CSS stiliai ir kabliai CSS stiliams
- Maketo talpyklos
- "JavaScript" kabliukai
- Skirta HTML, kad būtų lengviau skaityti
The DIV elementas buvo vienintelis elementas, kurį turėjome pridėti prie kabliukų, kad galėtume stilizuoti mūsų dokumentus ir kurti stulpelius ir išgalvotus išdėstymus. Dėl to mes galėjome susidoroti su HTML DIV elementai - ką web dizaineriai gali pavadinti "divitis". Buvo net WYSIWYG redaktoriai, kurie naudojo " DIV tik elementas. Aš iš tikrųjų paleisti per HTML, kuris naudoja DIV elementas vietoj punktų!
Naudodamiesi HTML5, mes galime pradėti naudoti segmentavimo elementus, kurdami daugiau semantinių aprašomųjų dokumentų (naudodami navigaciją, aprašomiesiems skaičiams ir kt.), Taip pat apibrėžkite stilių tuose elementuose.
Ką apie SPAN elementą?
Kitas elementas, kurį dauguma žmonių galvoja apie savo mintis DIV elementas yra elementas. Šis elementas, pavyzdžiui DIV, nėra semantinis elementas. Tai yra vidinis elementas, kurį galite naudoti pridėti kabliukų stilių ir scenarijus aplink turinio blokų (dažniausiai teksto) blokus. Šia prasme tai būtent kaip DIV elementas, tik inline, o ne blokinis elementas. Kai kuriais būdais gali būti lengviau galvoti apie DIV kaip bloko lygį SPAN elementą ir naudoti jį taip pat, kaip jūs SPAN tik visam HTML turinio blokui.
HTML5 sistemoje nėra panašaus inline segmentavimo elemento.
Senesnėms "Internet Explorer" versijoms
Net jei palaikysite žymiai senesnes IE versijas (pvz., IE 8 ir mažesnius), kurie nepatikimai atpažįsta HTML5, neturėtumėte bijoti semantiniu būdu naudoti teisingų HTML žymų. Semantika padės jums ir jūsų komandai valdyti puslapį ateityje (nes jūs žinosite, kad šis skyrius yra straipsnis, jei jis yra apsuptas STRAIPSNIS elementas). Be to, naršyklės, kurios atpažįsta šias žymes, juos palaikys geriau.
Jūs vis dar galite naudoti HTML5 semantinius segmentavimo elementus naudodami "Internet Explorer", jums tiesiog reikia pridėti scenarijus ir galbūt kelis aplinkinius DIV elementus, kad jie atpažintų žymas kaip HTML.
DIV ir SECTION ELEMENTŲ naudojimas
Jei naudojate jas teisingai, galite naudoti abi DIV ir SKYRIUS elementai kartu galiojančiame HTML5 dokumente. Kaip matote čia šiame straipsnyje, jūs naudojate SKYRIUS elementas apibrėžti semantiniu požiūriu atskiras turinio dalis, ir jūs naudojate DIV elementas kaip kabliai CSS ir JavaScript, taip pat apibrėžiant išdėstymą, kuris neturi semantinės reikšmės.
Originalus straipsnis Jennifer Krynin. Redagavo Jeremy Girard, 3/15/17
