Kāda ir atšķirība starp DIV un SECTION?

Izpratne par HTML5 sadaļas elementu

Elements SECTION tiek definēts kā tīmekļa lapas vai vietnes semantiska sadaļa, kas nav cita veida specifiskāks veids, piemēram, ARTIKULS vai PASĀKUMS. Dizaineri bieži izmanto šo elementu, atzīmējot atsevišķu lapas sadaļu — visu sadaļu, ko var pārvietot un izmantot citās vietnes lapās vai daļās. Tas ir atšķirīgs satura gabals.

Turpretim elements DIV ir piemērots lapas daļām, kuras vēlaties sadalīt citiem mērķiem semantika . Piemēram, daļu satura varat ietīt DIV, lai piešķirtu tam 'āķi' stilam ar CSS. Semantiski tā var nebūt atsevišķa satura sadaļa, taču tā ir nošķirta, lai jūs varētu sasniegt vēlamo izkārtojumu vai sajūtu.

Viss ir par semantiku

Vienīgā atšķirība starp elementiem DIV un SECTION ir semantika — the nozīmē no satura, ko sadalāt.

Jebkuram saturam, kas ietverts DIV elementā, nav raksturīgas nozīmes. To vislabāk izmantot tādām lietām kā:

• CSS stili un āķi CSS stiliem
• Izkārtojuma konteineri
• JavaScript āķi
• Sadalījums, kas padara saturu vai HTML vieglāk lasāmu

DIV elements agrāk bija vienīgais pieejamais elements, lai pievienotu āķus stila dokumentiem un izkārtojumiem. Pirms HTML5 tipiskā tīmekļa lapa bija piepildīta ar DIV elementiem. Faktiski daži WYSIWYG redaktori izmantoja tikai DIV elementu, dažreiz rindkopu vietā.

HTML5 ieviesa sadaļu elementus, kas radīja semantiski aprakstošākus dokumentus un palīdzēja definēt šo elementu stilus.

Kā ar SPAN elementu?

Vēl viens izplatīts nesemantisks elements ir SPAN. Tas ir izmantots rindā lai pievienotu āķus stiliem un skriptiem ap satura blokiem (parasti tekstam). Šajā ziņā tas ir tieši tāds pats kā DIV, bet nav a bloka elements . Padomājiet par DIV kā bloka līmeņa SPAN un izmantojiet to tādā pašā veidā, bet veseliem HTML satura blokiem.

HTML nav salīdzināma iekļauta sadaļas elementa.

Vecākām Internet Explorer versijām

Pat ja jūs atbalstāt ievērojami vecākas Microsoft Internet Explorer versijas, kas droši neatpazīst HTML5, jums vajadzētu izmantot semantiski pareizus HTML tagus. Semantika palīdzēs jums un jūsu komandai pārvaldīt lapu nākotnē. Internet Explorer jaunākās versijas, kā arī tās aizstājējs Microsoft Edge atpazīst HTML5.

Izmantojot DIV un SECTION elementus

Varat izmantot gan DIV, gan SECTION elementus derīgā HTML5 dokumentā — SECTION, lai definētu semantiski diskrētas satura daļas, un DIV, lai definētu āķus CSS, JavaScript un izkārtojuma nolūkiem.

Dženiferas Krininas oriģinālraksts. Rediģēja Džeremijs Žirārs, 15.03.17