כיצד להשתמש ספאן ו div אלמנטים HTML

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

• אם אתה צריך את האלמנט פשוט להוסיף סגנונות לאזור זה של הדף, עליך להשתמש באלמנט div.
• אם לתוכן שיש לכלול יש מיקוד ברור ויכול לעמוד בפני עצמו, ייתכן שתרצה להשתמש באלמנט הסעיף במקום זאת.

בסופו של דבר, הן divs וחתכים מתנהגים די דומה ואתה יכול לתת אחד מהם לייחס ערכים בסגנון שלהם CSS כדי לקבל את המראה של האתר שלך כי אתה צריך. שני אלה הם אלמנטים ברמה בלוק.

באמצעות אלמנט

אלמנט span הוא אלמנט מוטבע כברירת מחדל. זה מגדיר את זה בנפרד div ו אלמנטים סעיף. אלמנט span משמש לעתים קרובות כדי לעטוף פיסת תוכן ספציפית, בדרך כלל טקסט, לתת לו "וו" נוסף שיכול להיות מנוסח מאוחר יותר. משמש עם CSS, זה יכול לשנות את הסגנון של הטקסט הוא encloses; עם זאת, ללא כל סגנונות סגנון, אלמנט span בלבד אינו משפיע על טקסט כלל.

זהו ההבדל העיקרי בין תוחלת לבין אלמנטים div. כפי שצוין לעיל, אלמנט div כולל הפסקה של פסקאות, ואילו האלמנט span מציין רק לדפדפן להחיל כללי סגנון CSS הקשורים למה שמוגדר על ידי התגים :

טקסט מודגש וטקסט שאינו מודגש.

הוסף את הכיתה = "הדגשה" או מחלקה אחרת לאלמנט span כדי לסדר את הטקסט ב- CSS (לדוגמה, class = "highlight">).

אלמנט span אינו מכיל מאפיינים נדרשים, אך שלושת המאפיינים השימושיים ביותר זהים לאלה של האלמנט div:

• סִגְנוֹן
• מעמד
• תְעוּדַת זֶהוּת

השתמש ב- span כאשר ברצונך לשנות את סגנון התוכן מבלי להגדיר תוכן זה כמרכיב חדש ברמת החסימה במסמך.

לדוגמה, אם אתה רוצה את המילה השנייה של כותרת h3 להיות אדום, אתה יכול להקיף את המילה עם אלמנט span כי סגנון זה מילה כמו טקסט אדום. המילה עדיין נשארת חלק של אלמנט h3, אבל עכשיו גם מציג באדום:

זוהי הכותרת שלי Awesome

בעריכת ג'רמי ג'ירארד ב -2 / 2/17