Kuelewa HTML5 SECTION Element
Wakati HTML5 inavyoingia kwenye eneo hilo miaka kadhaa iliyopita, iliongeza kikundi cha vipengele vipya vipya kwa lugha ya kinywa, ikiwa ni pamoja na kipengele cha SECTION. Vipengele vingi vya vipengele vipya ambavyo HTML5 hujumuisha vina matumizi ya wazi. Kwa mfano, kipengele kinatumiwa kufafanua makala na sehemu kuu za ukurasa wa wavuti, kipengele kinatumiwa kufafanua maudhui yaliyomo ambayo si muhimu kwa ukurasa wote, na kichwa, nav, na footer ni maelezo ya kina sana. Kipengee kipya cha SECTION, hata hivyo, ni kidogo kidogo.
Watu wengi wanaamini kuwa vipengee vya HTML SECTION na kwa kweli ni kitu kimoja-jenereta cha chombo kinachotumiwa kuwa na maudhui kwenye ukurasa wa wavuti. Ukweli, hata hivyo, ni kwamba mambo haya mawili, wakati wote kuwa vipengele vya chombo, ni chochote lakini kizazi. Kuna sababu maalum ya kutumia kipengele cha SECTION na kipengele cha DIV - na makala hii itaelezea tofauti hizo.
Sehemu na Div
Kipengele cha SECTION kinafafanuliwa kama sehemu ya semantic ya ukurasa wa wavuti au tovuti ambayo sio aina nyingine maalum (kama makala au kando). Ninapenda kutumia kipengele hiki wakati ninapoweka sehemu tofauti ya ukurasa - sehemu ambayo inaweza kuhamishwa kwa jumla na kutumiwa kwenye kurasa nyingine au sehemu za tovuti. Ni kipande tofauti cha maudhui, au "sehemu" ya maudhui, kama ungependa.
Kwa upande mwingine, unatumia kipengele cha DIV kwa sehemu za ukurasa unayotaka kugawanya, lakini kwa madhumuni mengine isipokuwa semantics . Nitaifunga eneo la maudhui katika mgawanyiko ikiwa ninafanya hivyo tu kujitolea "ndoano" ya kutumia na CSS. Inaweza kuwa si sehemu tofauti ya maudhui yaliyotokana na semantics, lakini ni kitu ambacho mimi nikiamuru ili kufikia mpangilio nataka kwa ukurasa wangu.
& # 39; s Yote Kuhusu Semantics
Hii ni dhana ngumu kuelewa, lakini tofauti pekee kati ya kipengele cha DIV na kipengele cha SECTION ni semantics. Kwa maneno mengine, ni maana ya sehemu ya msimbo unayogawanya.
Maudhui yoyote yaliyomo ndani ya kipengele cha DIV haina maana yoyote ya asili. Ni bora kutumika kwa mambo kama:
- Mitindo ya CSS na ndoano kwa mitindo ya CSS
- Vyombo vya mpangilio
- Vipindi vya JavaScript
- Mgawanyiko wa HTML ili iwe rahisi kusoma
Kipengele cha DIV kilikuwa kinachotumiwa kuwa kipengele pekee tulichokuwa nacho kwa kuongeza ndoano kwa nyaraka za nyaraka zetu na kuunda nguzo na mipangilio ya dhana. Kwa sababu hiyo, tulimalizika na HTML iliyojaa vitu vya DIV-nini wabunifu wa wavuti wito "divit." Kulikuwa na wahariri WYSIWYG ambao walitumia kipengele cha DIV pekee. Nimekwisha kukimbia kwenye HTML ambayo inatumia kipengele cha DIV badala ya aya!
Kwa HTML5, tunaweza kuanza kutumia vipengele vya kugawa sehemu ili kuunda nyaraka zaidi zinazoelezea tu (kutumia kwa urambazaji na takwimu zinazoelezea na kadhalika) na pia kufafanua mitindo kwenye vipengele hivi.
Je! Kuhusu kipengele cha SPAN?
Kipengele kingine ambacho watu wengi wanafikiri wakati wanafikiria kipengele cha DIV ni kipengele. Kipengele hiki, kama DIV, si kipengele cha semantic. Ni kipengele cha ndani ambacho unaweza kutumia ili kuongeza ndoano kwa mitindo na maandiko juu ya vitalu vyenye ndani (kawaida maandishi). Kwa maana hiyo ni sawa na kipengele cha DIV, kifupi tu badala ya kipengele cha kuzuia . Kwa namna fulani, inaweza kuwa rahisi kufikiria DIV kama kipengele cha kuzuia kiwango cha SPAN na kuitumia kwa njia ile ile unayoweza SPAN tu kwa vitalu vyote vya maudhui ya HTML.
Hakuna kipengele kinachofanana cha kugawa kipengee katika HTML5.
Kwa Matoleo Mzee ya Internet Explorer
Hata kama unasaidia matoleo makubwa ya IE (kama IE 8 na ya chini) ambayo haitambui HTML5, haipaswi kuogopa kutumia vitambulisho vya HTML vya semantically sahihi. Semantics itasaidia wewe na timu yako kusimamia ukurasa baadaye (kwa sababu utajua kwamba sehemu hiyo ni makala ikiwa imezungukwa na kipengele cha ARTICLE). Pia, wavinjari ambao wanatambua vitambulisho hivi watawasaidia vizuri.
Bado unaweza kutumia vipengele vya kugawa vipengele vya HTML5 na Internet Explorer, unahitaji tu kuongeza scripting na uwezekano wa vipengele vidogo vyenye vipengee vya DIV ili uwape kutambua vitambulisho kama HTML.
Kutumia DIV na vipengele vya SECTION
Ikiwa unatumia kwa usahihi, unaweza kutumia vipengele vyote vya DIV na SECTION pamoja katika hati halali ya HTML5. Kama ulivyoona hapa katika makala hii, unatumia kipengele cha SECTION ili kufafanua sehemu za pekee za maudhui, na unatumia kipengele cha DIV kama ndoano kwa CSS na JavaScript na pia kuelezea mpangilio ambao hauna maana ya semantic.
Makala ya awali na Jennifer Krynin. Iliyotengenezwa na Jeremy Girard mnamo 3/15/17