מה ההבדל בין DIV לסעיף?

אלמנט ה- SECTION מוגדר כקטע סמנטי של דף אינטרנט או אתר שאינו סוג ספציפי אחר כמו ARTICLE או ASIDE. מעצבים משתמשים לעתים קרובות באלמנט זה כאשר מסמנים קטע מובהק של הדף - קטע שלם שניתן להזיז ולהשתמש בו בדפים או בחלקים אחרים של האתר. זהו פיסת תוכן מובהקת.

לעומת זאת, אלמנט DIV מתאים לחלקים מהעמוד שברצונך לחלק למטרות אחרות סֵמַנטִיקָה. לדוגמה, ייתכן שתעטוף תוכן כלשהו ב- DIV כדי לתת לו "וו" לסגנון עם CSS. זה לא יכול להיות קטע מובהק של תוכן מבחינה סמנטית, אך הוא מוגדר כך שתוכל להשיג פריסה או תחושה רצויים.

הכל על סמנטיקה

ההבדל היחיד בין רכיבי DIV ו- SECTION הוא סמנטיקה - ה- מַשְׁמָעוּת מהתוכן שאתה מחלק.

לכל תוכן הכלול באלמנט DIV אין משמעות מובנית. מומלץ להשתמש בו לדברים כמו:

  • סגנונות CSS ווים לסגנונות CSS
  • מיכלי פריסה
  • ווים של JavaScript
  • חטיבות המקלות על קריאת תוכן או HTML

אלמנט DIV היה בעבר האלמנט היחיד הזמין להוספת ווים למסמכים ולפריסות בסגנון. לפני HTML5, דף האינטרנט האופייני היה מלא באלמנטים של DIV. למעשה, כמה מעורכי WYSIWYG השתמשו באלמנט DIV באופן בלעדי, לפעמים במקום פסקאות.

HTML5 הציג רכיבי חתך שיצרו מסמכים תיאוריים יותר סמנטיים ועזרו להגדיר סגנונות על אותם אלמנטים.

instagram viewer

מה לגבי אלמנט ה- SPAN?

אלמנט נפוץ נוסף שאינו סמנטי הוא SPAN. זה בשימוש בשורה כדי להוסיף ווים לסגנונות וסקריפטים סביב גושי תוכן (בדרך כלל טקסט). מהבחינה הזו, זה בדיוק כמו ה- DIV, אבל הוא לא a אלמנט חסום. חשוב על ה- DIV כ- SPAN ברמת הבלוק ולהשתמש בו באותו אופן, אך עבור בלוקים שלמים של תוכן HTML.

ל- HTML אין אלמנט חלוקה מוטבע מקביל.

לגרסאות ישנות יותר של Internet Explorer

גם אם אתה תומך בגרסאות ישנות יותר של Internet Explorer של מיקרוסופט שאינן מזהות HTML5 באופן מהימן, עליך להשתמש בתגי HTML נכונים מבחינה סמנטית. הסמנטיקה תעזור לך ולצוותך לנהל את הדף בעתיד. הגרסאות האחרונות של Internet Explorer, כמו גם החלפתו, Microsoft Edge, מזהות HTML5.

שימוש באלמנטים DIV ו- SECTION

אתה יכול להשתמש גם באלמנטים DIV וגם ב- SECTION יחד במסמך HTML5 חוקי - SECTION, להגדרה חלקים נפרדים מבחינה סמנטית של התוכן, ו- DIV, להגדרת ווים עבור CSS, JavaScript ופריסה מטרות.

מאמר מקורי מאת ג'ניפר קרינין. נערך על ידי ג'רמי ג'ירארד בתאריך 15/3/17.

instagram story viewer