מה זה border?

המאפיין border ב-CSS משמש לקביעת גבולות לאלמנט. ניתן לקבוע את סוג הגבול (קו רציף, מקוטע, מנוקד וכו'), רוחב (כגון 1px, 2px) וצבע (כגון אדום, כחול). זהו מאפיין מקצר שמאגד את המאפיינים border-width, border-style ו-border-color.

שימוש במאפיין border

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

דוגמה לשימוש ב-border

להלן דוגמה לשימוש במאפיין border:

בדוגמה זו, הגבול הוא בקו רציף ברוחב 2 פיקסלים ובצבע שחור.

שימושים מתקדמים

באמצעות border ניתן לשלב עם מאפיינים נוספים כמו border-radius כדי ליצור גבולות מעוגלים או עם border-image ליצירת גבולות מותאמים אישית עם תמונה.

    <div style="border: 2px solid black; width: 100px; height: 100px;"></div>