Koks skirtumas tarp DIV ir SECTION?

click fraud protection

Elementas SECTION apibrėžiamas kaip semantinė tinklalapio ar svetainės dalis, kuri nėra kitas konkretesnis tipas, pvz., ARTICLE ar ASIDE. Dizaineriai dažnai naudoja šį elementą žymėdami atskirą puslapio dalį - visą skyrių, kurį galima perkelti ir naudoti kituose puslapiuose ar svetainės dalyse. Tai aiškus turinys.

Priešingai, DIV elementas yra tinkamas toms puslapio dalims, kurias norite padalyti kitais tikslais semantika. Pavyzdžiui, galite suvynioti tam tikrą turinį į DIV, kad suteiktumėte „kabliuką“ stiliui su CSS. Tai gali būti ne aiški turinio dalis semantiškai, bet ji išskirta taip, kad galėtumėte pasiekti norimą išdėstymą ar jaustis.

Viskas apie semantiką

Vienintelis skirtumas tarp DIV ir SECTION elementų yra semantika - tai prasmė dalijamo turinio.

Bet koks DIV elemente esantis turinys neturi jokios prasmės. Tai geriausia naudoti tokiems dalykams kaip:

  • CSS stiliai ir CSS stilių kabliukai
  • Išdėstymo konteineriai
  • „JavaScript“ kabliai
  • Skirstymai, kurie palengvina turinio ar HTML skaitymą
instagram viewer

DIV elementas anksčiau buvo vienintelis elementas, prieinamas norint pridėti kabliukus prie stiliaus dokumentų ir maketų. Prieš HTML5 tipinis tinklalapis buvo išmargintas DIV elementais. Tiesą sakant, kai kurie WYSIWYG redaktoriai naudojo tik DIV elementą, kartais vietoj pastraipų.

HTML5 pristatė sekcijų elementus, kurie sukūrė semantiškai apibūdinančius dokumentus ir padėjo apibrėžti tų elementų stilius.

Ką apie SPAN elementą?

Kitas įprastas nesemantinis elementas yra SPAN. Jis naudojamas tiesiai pridėti stilių ir scenarijų kabliukus aplink turinio (paprastai teksto) blokus. Ta prasme, tai visiškai kaip DIV, bet nėra blokuoti elementą. Pagalvokite apie DIV kaip apie bloko lygio SPAN ir naudoti jį tokiu pačiu būdu, bet ištisiems HTML turinio blokams.

HTML neturi panašaus įterptinio skyrimo elemento.

Senesnėms „Internet Explorer“ versijoms

Net jei palaikote dramatiškai senesnes „Microsoft Internet Explorer“ versijas, kurios patikimai neatpažįsta HTML5, turėtumėte naudoti semantiškai teisingas HTML žymas. Semantika padės jums ir jūsų komandai tvarkyti puslapį ateityje. Naujausios „Internet Explorer“ versijos ir jos pakeitimas „Microsoft Edge“ atpažįsta HTML5.

DIV ir SECTION Elementų naudojimas

Apibrėžti galite naudoti tiek DIV, tiek SECTION elementus galiojančiame HTML5 dokumente - SECTION semantiškai atskiros turinio dalys ir DIV, norint apibrėžti CSS, „JavaScript“ ir išdėstymo kabliukus tikslai.

Originalus Jennifer Krynin straipsnis. Redagavo Jeremy Girardas 17-03-15.

instagram story viewer