<section> සහ <div> අතර වෙනස කුමක්ද?

959

අතර ඇති වෙනස කුමක්ද <section>සහ <div>දී HTML?
මෙම අවස්ථා දෙකෙහිම අපි කොටස් නිර්වචනය කරන්නේ නැද්ද?

html

— සරල බව
source

1

— එතීම

1057

<section> එහි තේරුම ඇතුළත අන්තර්ගතය කාණ්ඩගත කර ඇති බවයි (එනම් තනි තේමාවකට සම්බන්ධයි), එය පිටුවේ දළ සටහනක ඇතුළත් කිරීමක් ලෙස දිස්විය යුතුය.

<div>අනෙක් අතට, කිසිදු අර්ථය සමර්පණය නැත පසෙකට එහි කිසිදු සොයා ගත් සිට, class, langහා titleගුණාංග.

එබැවින් නැත: a භාවිතා කිරීම <div>HTML හි කොටසක් අර්ථ දක්වන්නේ නැත.

පිරිවිතරයෙන්:

`<section>`

මෙම <section>අංගය යම් ලියවිල්ලක හෝ අයදුම්පත ක Generic බලපත්රය යටතේ අවසර ලබා ඇත කොටස නියෝජනය කරයි. කොටසක්, මෙම සන්දර්භය තුළ, තේමාත්මක අන්තර්ගත සමූහකරණයකි. සෑම එකක්ම sectionහඳුනාගත යුතුය, සාමාන්‍යයෙන් මූලද්‍රව්‍යයේ දරුවෙකු ලෙස ශීර්ෂයක් (h1-h6 මූලද්‍රව්‍යය) ඇතුළත් කිරීමෙන් <section>.

කොටස් සඳහා උදාහරණ වනුයේ පරිච්ඡේද, ටැබ් කළ සංවාද කොටුවක ඇති විවිධ ටැබ් පිටු හෝ නිබන්ධනයක අංකිත කොටස් ය. හැඳින්වීමක්, ප්‍රවෘත්ති අයිතම සහ සම්බන්ධතා තොරතුරු සඳහා වෙබ් අඩවියක මුල් පිටුව කොටස් වලට බෙදිය හැකිය.

...

මෙම <section>මූලද්රව්යය Generic බලපත්රය යටතේ අවසර ලබා ඇත රුවනයකි අංගයක් නොවේ. මූලද්‍රව්‍යයක් අවශ්‍ය වන්නේ මෝස්තරකරණ අරමුණු සඳහා හෝ ස්ක්‍රිප්ටින් සඳහා පහසුවක් ලෙස නම්, <div>ඒ වෙනුවට මූලද්‍රව්‍යය භාවිතා කිරීමට කතුවරුන් උනන්දු කරනු ලැබේ. සාමාන්‍ය රීතියක් නම් <section>මූලද්‍රව්‍යය සුදුසු වන්නේ මූලද්‍රව්‍යයේ අන්තර්ගතය ලේඛනයේ දළ සටහනෙහි පැහැදිලිව ලැයිස්තුගත කර ඇත්නම් පමණි.

( https://www.w3.org/TR/html/sections.html#the-section-element )

`<div>`

මෙම <div>මූලද්රව්යය සියලු දී කිසිදු විශේෂ අර්ථයක් ඇත. එය එහි දරුවන් නියෝජනය කරයි. එය සමග භාවිතා කල හැකි class, langසහ titleඅඛණ්ඩව අංග පිරිසකට semantics පොදු ලකුණු කිරීමටත් ගුණාංග.

සටහන:<div> වෙනත් මූලද්‍රව්‍යයක් සුදුසු නොවන විට, මූලද්‍රව්‍යය අවසාන ප්‍රයත්නයේ අංගයක් ලෙස බැලීමට කතුවරුන් දැඩි ලෙස දිරිමත් කරනු ලැබේ. මූලද්රව්යය වෙනුවට වඩාත් සුදුසු මූලද්රව්ය භාවිතා කිරීම පා <div>readers කයන්ට වඩා හොඳ ප්රවේශයක් සහ කතුවරුන්ට පහසුවෙන් නඩත්තු කළ හැකිය.

( https://www.w3.org/TR/html/grouping-content.html#the-div-element )

— පෝල් ඩී. වේට්
source

23

මෙම පිළිතුරේ ආලෝකය ඇතුළුව sectionඑදිරිව එදිරිව වැඩි යමක් ගැන සිතමින් div, මම නිගමනය කළේ ඒවා හරියටම එකම අංගයක් බවය. W3C පවසන්නේ div"තම දරුවන් නියෝජනය කරන" බවයි. හොඳයි, එයද sectionමූලද්‍රව්‍යය කරන්නේ නොවේද? ඔව්, sectionඑයින් ගම්‍ය වන්නේ එහි දරුවන් කාණ්ඩගත වී ඇති නමුත් ළමයින්ව තුළට දැමීමේ ක්‍රියාවෙන්ම divඔබත් ඔව්, ඔවුන් කණ්ඩායම් කරන බවයි . අවම වශයෙන් මම එය කරන ආකාරය, මම ඔබ ගැන නොදනිමි.

— trysis

9

rytrysis: “ sectionඑදිරිව එදිරිව වැඩියෙන් සිතීම div” - ඒ ගැන ඕනෑවට වඩා නොසිතන්න. HTML සංකීර්ණ නොවේ. "ළමයින්ව ඇතුළට දැමීමේ ක්‍රියාවෙන්ම divඔබත් ඔව්, ඔවුන් කණ්ඩායම්ගත කරනවා ." ඔබ නොවන HTML පිරිවිතරයට අනුව නොවේ. ඔබ ඒවා divමෝස්තරකරණ අරමුණු සඳහා හෝ ජාවාස්ක්‍රිප්ට් පහසුව සඳහා හෝ W3C තවමත් නොසිතූ වෙනත් දෙයක් සඳහා ඔතා ඇත , නමුත් ළමා අංග සමූහයක් බව පා readers කයන්ට ඇඟවුම් නොකරයි.

— පෝල් ඩී. වේට්

9

@ Matian2040: HTML හි අරමුණ පෙළට අර්ථයක් එක් කිරීම නිසා, <p>This is a paragraph</p>හෝ <h2>This is a second-level heading</h2>. නිසා <div>කිසිදු අර්ථයක් එකතු, ප්රශ්නය, පෙළ සඳහා සුදුසු අර්ථය බව අපි තවත් HTML අංගයක් නැති නම් පමණක් ඔබ එය භාවිතා කියලා.

— පෝල් ඩී. වේට්

7

කොටස් භාවිතා කරන්නේ නම් එක වාසියක් නැද්ද? lol, එය එසේ වන්නේ ඇයි?

— කළු

15

D එඩ්වර්ඩ් බ්ලැක්: එය අනෙක් ටැග් වලට වඩා වෙනස් අර්ථයක් ගෙන එයි. අර්ථය ප්‍රකාශ කිරීම යනු HTML හි සමස්ත ලක්ෂ්‍යයයි.

— පෝල් ඩී වේට්

74

<section>මහනුවර දක්වා වන ලකුණු කොටස , <div>කිසිදු ආශ්රිත semantics සමග Generic බලපත්රය යටතේ අවසර ලබා ඇත වාරණ දක්වා ලකුණු.

— ක්වෙන්ටින්
source

ArMarwenTrabelsi - සබැඳිය මිය ගොස් නැත. "කොටස" යනු සම්මත ඉංග්‍රීසි වචනයකි. ශබ්ද කෝෂ තිබේ.

— ක්වෙන්ටින්

ArMarwenTrabelsi - ඔබ "වියුක්ත හා පුළුල්" ලෙස හඳුන්වන වචන ප්‍රධාන වෙනස්කම් වේ.

— ක්වෙන්ටින්

65

`<div> Vs <Section>`

පළමු වටය

<div>:මෙම HTML අංගයක් (හෝ HTML ලේඛන අංශය මූලද්රව්ය) කිසිවක් නෛසර්ගිකවම නියෝජනය නොවන ගලා අන්තර්ගතය සඳහා Generic බලපත්රය යටතේ අවසර ලබා ඇත රුවනයකි, වේ. මෝස්තරකරණ අරමුණු සඳහා (පංති හෝ හැඳුනුම් ගුණාංග භාවිතා කරමින්) කණ්ඩායම් මූලද්‍රව්‍ය සඳහා එය භාවිතා කළ හැකිය, නැතහොත් ඒවා ලැන්ග් වැනි ගුණාංග අගයන් බෙදාගන්නා බැවිනි. එය භාවිතා කළ යුත්තේ වෙනත් අර්ථකථන මූලද්‍රව්‍යයක් ( <article>හෝ වැනි <nav>) සුදුසු නොවන විට පමණි.

<section>:මෙම HTML වගන්තිය මූලද්රව්යය ( <section>) සාමාන්යයෙන් මාතෘකාව සමග ලේඛනයේ Generic බලපත්රය යටතේ අවසර ලබා ඇත කොටස, එනම්, අන්තර්ගතය තේමාත්මක කන්ඩායමක්, නියෝජනය කරයි.

දෙවන වටය

<div>: බ්‍රව්සර් සහාය රූප විස්තරය මෙහි ඇතුළත් කරන්න

<section>: බ්‍රව්සර් සහාය

වගුවේ ඇති සංඛ්‍යා මඟින් මූලද්‍රව්‍යයට පූර්ණ සහය දක්වන පළමු බ්‍රව්සර අනුවාදය නියම කරයි. රූප විස්තරය මෙහි ඇතුළත් කරන්න

එම නහරය තුළ, බෙදීමක් අදාළ වන්නේ පිරිසිදු CSS හෝ DOM දෘෂ්ටිකෝණයකින් පමණක් වන අතර, කොටසක් අර්ථ නිරූපණයට ද නුදුරු අනාගතයේ දී සෙවුම් යන්ත්‍ර මගින් සුචිගත කිරීම සඳහා ද අදාළ වේ.

— සුබෝද් ගුලාක්ස්
source

10

බ්‍රව්සර් සහාය මෙහි ගැටළුවක් නොවන අතර එය අර්ථ නිරූපණයකි. ඔබ HTML5 භාවිතා කරන්නේ නම්, ඔබ කෙසේ හෝ පොලිෆිල් එකක් භාවිතා කරනු ඇත.

— ජැක් ටක්

Ack ජැක් ටක් සහ ඔබට එවැනි ක්ලඩ්ජ් භාවිතා කිරීමට අවශ්‍ය නැතිනම් කුමක් කළ යුතුද?

— ලිස්ටර් මහතා

53

නිරීක්ෂණයක් පමණක් - මෙය සනාථ කරන කිසිදු ලේඛනයක් හමු වී නැත

කොටසක තවත් කොටසක් තිබේ නම්, අභ්‍යන්තර කොටසේ h1 ශීර්ෂයක් පිටත කොටසේ h1- ශීර්ෂයට වඩා කුඩා අකුරු වලින් දර්ශනය වේ. කොටස වෙනුවට div භාවිතා කරන විට අභ්‍යන්තර div h1-header එක h1 ලෙස තට්ටු කරයි.

<section>
  <h1>Level1</h1>
  some text
  <section>
    <h1>Level2</h1>
    some more text
  </section>
</section>

- Level2 - ශීර්ෂකය Level1 - ශීර්ෂයට වඩා කුඩා අකුරු වලින් දර්ශනය වේ.

H1 ශීර්ෂය වර්ණ ගැන්වීමට css භාවිතා කරන විට, අභ්‍යන්තර h1 ද වර්ණවත් විය (සාමාන්‍ය h1 ලෙස හැසිරේ). ෆයර්ෆොක්ස් 18, අයිඊ 10 සහ ක්‍රෝම් 28 හි එකම හැසිරීම එයයි.

— runec
source

2

කෙතරම් අමුතුද ... මෙය නිරූපණය කිරීම සඳහා ඉක්මන් ස්ටැක්බ්ලිට්ස් නිර්මාණය කරන ලදි, එය තවමත් දෙයක් වන නිසා stackblitz.com/edit/angular-h1ayez

— Gavin Mannion

26

HTML5 ප්‍රමිතියේ ,. <section> මූලද්‍රව්‍යය සම්බන්ධිත මූලද්‍රව්‍ය කාණ්ඩයක් ලෙස අර්ථ දැක්වේ.

මෙම <div>මූලද්රව්යය දරුවන් මූලද්රව්ය වාරණ පරිදි අර්ථ දක්වා ඇත.

— srikanth_k
source

කවුරුහරි මෙය සලකුණු කළේ ඇයිදැයි මම නොදනිමි. කෙටි, පැණිරස හා කාරණය ද වේ.

— user6031759

1

-1 එය කිසිදු තේරුමක් නැත, ධූරාවලි ව්‍යුහ ලේඛනයේ (XML / HTML) අදාළ අංග සමූහගත කිරීමට ඔබට අවශ්‍ය වන්නේ කෙසේද, ඔබට ඕනෑම ටැගයක් භාවිතා කරමින් ළමා අංග සමූහගත කළ හැකිය.

— ස්විස්ටැක්

V ස්විස්ටැක් ඕනෑම කොටු ටැගයකට (එනම් ස්වයං වසා දැමීම / අවලංගු නොවේ) ළමා මූලද්‍රව්‍ය කාණ්ඩගත කළ හැකි බව ඔබ නිවැරදිය. මම හිතන්නේ මෙය දරුවන්ගේ සම්බන්ධතාවය කුමක්ද යන්න පිළිබඳව වැඩි අවධානයක් යොමු කරයි. ඔවුන් සියල්ලන්ටම ප්‍රකාශ කිරීමට අදාළ සන්දර්භයක් තිබේද? උදාහරණයක් ලෙස: ක්‍රියාකාරීත්වය / මෝස්තර හේතුන් මත යෙදවුම් කිහිපයක් අඩංගු පෝරමයක් කාණ්ඩගත කෙරේ. නමුත් මෙම පෝරමය වෙබ් අඩවියේ කොටසක් නොව ඒ වෙනුවට ශ්‍රිතයක් සහිත කොටසකි. දැන් ඔබගේ පිටුව නිෂ්පාදනයක් විස්තර කරන බව කියමු. මූලද්රව්ය සාමූහික අදහසක් ගෙන දෙන නිසා නිෂ්පාදනයේ විවිධ කොටස් කොටස් මූලද්රව්යයක ලැයිස්තුගත කෙරේ.

— සැන්ඩෝර්

21

බෙදීම් මූලද්‍රව්‍යයක් වෙනුවට ආදේශකයක් ලෙස කොටසේ ටැගය ඕනෑවට වඩා භාවිතා නොකිරීමට වගබලා ගන්න . ඒ කොටස ටැගය සන්දර්භය තුල සැලකිය යුතු කලාපයේ නිර්වචනය කළ යුතු ශරීරය . අර්ථාන්විතව, HTML5 අපගේ ලේඛනය පහත පරිදි අර්ථ දැක්වීමට අපව දිරිමත් කරයි:

<html>
<head></head>
<body>
    <header></header>
    <section>
        <h1></h1>
        <div>
            <span></span>
        </div>
        <div></div>
    </section>
    <footer></footer>
</body>
</html>

ස්නිපටය පුළුල් කරන්න

මෙම උපාය මඟින් වෙබ් රොබෝවරුන්ට සහ ස්වයංක්‍රීය තිර පා readers කයන්ට ඔබේ අන්තර්ගතයේ ප්‍රවාහය වඩා හොඳින් තේරුම් ගැනීමට ඉඩ ලබා දේ. මෙම සලකුණු කිරීම මඟින් ඔබේ ප්‍රධාන පිටු අන්තර්ගතය කොතැනදැයි පැහැදිලිව නිර්වචනය කරයි. ඇත්ත වශයෙන්ම, වෙබ් අඩවි තුළ පිටු දහස් ගණනක් නොව දහස් ගණනක් පුරා ශීර්ෂ සහ පාදක බොහෝ විට පොදු වේ. අද්විතීය අන්තර්ගතය අඩංගු වන්නේ කොතැනද යන්න පැහැදිලි කිරීම සඳහා අංශ ටැගය සීමා කළ යුතුය. තුළ කොටස ටැගය, එසේ නම් අප මෙන් ම, රාව අඩු වන HTML ටැග් අන්තර්ගතය සලකුණු සහ පාලනය කළ යුතුයි h1 , div , කාලයක් ආදිය,

බොහෝ සරල පිටුවල තිබිය යුත්තේ තනි කොටස් ටැගයක් මිස බහු ඒවා නොවේ. කොටසට සමාන වෙනත් රසවත් HTML5 ටැග් ද ඇති බව කරුණාවෙන් සලකන්න . ඔබේ ලේඛන ප්‍රවාහය තුළ ලිපිය , සාරාංශය , පසෙකට සහ වෙනත් ඒවා භාවිතා කිරීම සලකා බලන්න . ඔබට පෙනෙන පරිදි, මෙම ටැගයන් HTML ලේඛනයේ ප්‍රධාන කලාප නිර්වචනය කිරීමේ අපගේ හැකියාව තවදුරටත් වැඩි කරයි.

— CoolWebDezign
source

"බොහෝ සරල පිටුවල තිබිය යුත්තේ තනි අංශ ටැගයක් පමණි". ඔබට තනි පිටුවක බහු කොටස් ටැග් භාවිතා කිරීමට අවශ්‍ය සරල නොවන උදාහරණයක් ලබා දිය හැකිද?

— ස්ටයිෆල්

8

මම එහි mainටැගය භාවිතා කරන අතර එහි ඇතුළත sectionටැග් එකක් හෝ කිහිපයක් භාවිතා කරමි .

— Chazy Chaz

11

<div>අපි කවුරුත් දන්නා සහ ආදරය කරන සාමාන්‍ය ප්‍රවාහ බහාලුම. එය අතිරේක අර්ථකථන අර්ථයක් නොමැති බ්ලොක් මට්ටමේ මූලද්‍රව්‍යයකි (W3C: Markup, WhatWG)

<section>සාමාන්‍ය ලේඛනයක් හෝ යෙදුම් අංශයක්. සාමාන්‍යයෙන් ශීර්ෂයක් (මාතෘකාවක්) ඇති අතර සමහර විට පාදකයක් ද ඇත. එය දිගු ලිපියක උප කොටසක්, පිටුවේ ප්‍රධාන කොටසක් (උදා: මුල් පිටුවෙහි ප්‍රවෘත්ති අංශය) හෝ වෙබ්අප් ටැබ් අතුරුමුහුණතක පිටුවක් වැනි අදාළ අන්තර්ගතයේ කොටසකි. (W3C: Markup, WhatWG)

මගේ යෝජනාව: div: අඩු අනුවාදය භාවිතා කර ඇත (මම හිතන්නේ 4.01 සිට තවමත්) html මූලද්‍රව්‍යය (බොහෝ නිර්මාණකරුවන් එය හසුරුවා ඇත). කොටස: මෑතකදී එන (html5) html මූලද්‍රව්‍යය.

— anglimasS
source

9

කොටසේ ටැගය html සඳහා වඩාත් අර්ථකථන වාක්‍ය ඛණ්ඩයක් සපයයි. div යනු කොටසකට සාමාන්‍ය ටැගයකි. සුදුසු අන්තර්ගතයන් සඳහා ඔබ අංශ ටැගය භාවිතා කරන විට, එය සෙවුම් යන්ත්‍ර ප්‍රශස්තිකරණය සඳහා ද භාවිතා කළ හැකිය. කොටසේ ටැගය මඟින් HTML විග්‍රහ කිරීම පහසු කරයි. වැඩි විස්තර සඳහා, යොමු වන්න. http://blog.whatwg.org/is-not-just-a-semantic

— පූමලිරාජ්
source

1

“කොටසේ ටැගය මඟින් HTML විග්‍රහ කිරීම පහසු කරයි” - එහ්? පිටුවේ දළ සටහනක් ජනනය කිරීම සඳහා ඔබ අදහස් කරනවාද?

— පෝල් ඩී. වේට්

7

භාවිතා <section>විය හැක neater , උදව් තිරය පාඨකයන් සහ SEO අතර <div>වේ බයිට් කුඩා හා වර්ගය වඩා ඉක්මනින්

සමස්තයක් වශයෙන් ඉතා සුළු වෙනසක්.

එසේම, a ඇතුල් කිරීම නිර්දේශ නොකරයි , ඒ වෙනුවට a ඇතුලත <section>තබන්න<section><div><section>

— ඩ්‍රෝ
source

1

එම <section> ටැගය එවැනි පරිච්ඡේද, ශීර්ෂක, පාදක, හෝ ලේඛනයේ වෙනත් ඕනෑම ශාඛාවන් ලෙස, ලේඛනයක කොටස් නිර්වචනය කරයි.

ෙකෙසේෙවතත්:

එම <div> ටැගය අංශය හෝ HTML ලේඛනයේ කොටසක් නිර්වචනය කරයි.

මෙම <div>ටැගය CSS ඔවුන්ට සංයුති පිරිසක් වාරණ-අංග කිරීමට භාවිතා කරයි.

— ජීව්ස්
source

2

ලේඛනයේ ශීර්ෂ පා foot, පාදක සහ අනෙකුත් කොටස් වලට ඔවුන්ගේම අර්ථකථන ටැග් ඇත. (<header> , <footer>, <nav>, <article>ආදිය)

— ඔලිවර්

1

<section></section>

HTML <section>මූලද්‍රව්‍යය ලේඛනයක සාමාන්‍ය කොටසක් නියෝජනය කරයි, එනම්, සාමාන්‍යයෙන් මාතෘකාවක් සහිත අන්තර්ගත තේමාත්මක කාණ්ඩගත කිරීමකි. සෑම එකක්ම <section>හඳුනාගත යුතුය, සාමාන්‍යයෙන් මූලද්‍රව්‍යයේ දරුවෙකු ලෙස ශීර්ෂයක් ( <h1>- <h6>මූලද්‍රව්‍යය) ඇතුළත් කිරීමෙන් <section> . විස්තර සඳහා කරුණාකර පහත සබැඳිය අනුගමනය කරන්න.

යොමුව:

<div></div>

HTML <div>මූලද්‍රව්‍යය (හෝ HTML ලේඛන අංශය මූලද්‍රව්‍යය) යනු ප්‍රවාහ අන්තර්ගතය සඳහා වන සාමාන්‍ය බහාලුම වන අතර එය සහජයෙන්ම කිසිවක් නියෝජනය නොකරයි. මෝස්තරකරණ අරමුණු සඳහා (පංති හෝ හැඳුනුම් ගුණාංග භාවිතා කරමින්) කණ්ඩායම් මූලද්‍රව්‍ය සඳහා එය භාවිතා කළ හැකිය, නැතහොත් ඒවා ලැන්ග් වැනි ගුණාංග අගයන් බෙදාගන්නා බැවිනි. එය භාවිතා කළ යුත්තේ වෙනත් අර්ථකථන මූලද්‍රව්‍යයක් ( <article>හෝ වැනි <nav>) සුදුසු නොවන විට පමණි.

යොමුව: - http://www.w3schools.com/tags/tag_div.asp - https://developer.mozilla.org/en/docs/Web/HTML/Element/div

ඒවා අතර ඇති වෙනස්කම් ගැන වැඩි විස්තර සාකච්ඡා කරන සබැඳි කිහිපයක් මෙන්න:

— අසාද් අලි
source

1

වෙබ් යෙදුමක් සම්බන්ධයෙන් (තනිකරම ආත්මීය) මෑත කාලීන html5 මූලද්‍රව්‍ය කිහිපයක් වෙන්කර හඳුනා ගන්නේ කෙසේද යන්න පිළිබඳ උපදෙස් මෙන්න.

<section>චිත්‍රක පරිශීලක අතුරුමුහුණතක විජට් එකක් සලකුණු කරන අතර, විජට් එකක <div>සංරචක බොත්තමක් තබා ඇති බහාලුමක් වැනි ලේබලයක් සහ ලේබලයක් යනාදිය සලකුණු කරයි.

<article> අරමුණක් බෙදාගන්නා කණ්ඩායම් විජට්.

<header> මාතෘකාව සහ මෙනුබාර් වේ.

<footer> තත්ව තීරුව වේ.

— කාන් ඊ.
source

2

මෙය කොතරම් වැරදියිද, කොතැනින් පටන් ගත යුතුදැයි මට විශ්වාස නැත. දෘශ්‍ය අර්ථ 0 ඇති සහ 100% අර්ථකථන සහිත මූලද්‍රව්‍යයන්ට ඔබ දෘශ්‍ය අර්ථය පවරයි. ඔබේ අදහස් දැක්වීමේදී <section> <article> <header> සහ <footer> වෙනුවට <div> ආදේශ කළහොත් ඔබ නිවැරදි වනු ඇත.

— සෙත් වර්බර්ටන්