css overflow

תפריט ראשי

מבוא ל-CSSצבעים ב-CSSפונקציות CSSמחולל דוגמאות CSSטיפים וטריקים ב CSSאודות אתר סי.אס.אס. גייד

מאפייני CSS

accent-coloralignanimationappearanceaspect-ratiobackgroundblock-sizeborderbottomboxcaption-sidecaret-colorclearcolorcolumncolumnscursordirectiondisplayempty-cellsflexfloatfontgapgridheightinline-sizeinsetjustifyleftletter-spacingline-heightlistmarginmaxminmix-blend-modeobjectopacityoutlineoverflowoverflow-wrapoverflow-xoverflow-ypaddingperspectivepointer-eventsresizerightrotaterow-gapscalescrollbartab-sizetable-layouttexttoptransform-origintransition-delaytranslateunicode-bidiuser-selectvertical-alignvisibilitywhite-spacewidthwordwriting-modez-index

✔️ overflow CSS Style Property

המאפיין overflow מגדיר הוספת פסי גלילה אנכיים ואופקיים תמיד או רק במידה והתוכן גדול מהאלמנט המכיל אותו

דוגמא: מגדיר איך להציג את התוכן של האלמנט, כאשר התוכן לא נכנס במימדי האלנמנט וגולש אל מחוץ לאלמנט.

Demo Panel:
זהו מלל (טקסט) ארוך ארוך המאפשר להדגים מצב בו המלל הוא ארוך.
מצב בו אורך המלל הוא גדול נותן אפשרות להציג את הדוגמא בצורה טובה להבנת ההדגמה.
צוות האתר CSSGuide כתב את דוגמא זו על מנת להדגים בצורה טובה את הדוגמא.
דוגמא זו נכתבה על מנת לתת מענה לדוגמאות המצריכות מלל ארוך.
לפעמים בשביל להדגים בצורה הכי טובה יש לתת דוגמא עם הרבה מילים ושורות.
על מנת לכתוב מלל ארוך, צוות האתר השתמש במיטב הכלים.
חוץ ממללים ארוכים האתר CSSGuide נותן דוגמאות CSS למגוון מאפיינים.
CSS:
HTML:
Syntax:

overflow: visible | hidden | scroll | auto | initial | inherit;

Valid values:
  • visible, hidden, clip, scroll, auto, overlay, revert, revert-layer, unset, inherit, initial

Js Syntax: element.style.overflow

תאימות דפדפנים

overflow
הערך שנבדקChromeFirefoxEdgeCOpera
scroll✔️✔️✔️✔️
visible✔️✔️✔️✔️
hidden✔️✔️✔️✔️
clip✔️✔️✔️✔️
auto✔️✔️✔️✔️
overlay✔️✔️✔️✔️
revert✔️✔️✔️✔️
revert-layer✔️✔️✔️✔️
unset✔️✔️✔️✔️
inherit✔️✔️✔️✔️
initial✔️✔️✔️✔️

דוגמא: מגדיר איך להציג את התוכן של האלמנט, כאשר התוכן לא נכנס במימדי האלנמנט וגולש גם לצדדים.

Demo Panel:
זהו מלל (טקסט) ארוך ארוך המאפשר להדגים מצב בו המלל הוא ארוך.
מצב בו אורך המלל הוא גדול נותן אפשרות להציג את הדוגמא בצורה טובה להבנת ההדגמה.
צוות האתר CSSGuide כתב את דוגמא זו על מנת להדגים בצורה טובה את הדוגמא.
דוגמא זו נכתבה על מנת לתת מענה לדוגמאות המצריכות מלל ארוך.
לפעמים בשביל להדגים בצורה הכי טובה יש לתת דוגמא עם הרבה מילים ושורות.
על מנת לכתוב מלל ארוך, צוות האתר השתמש במיטב הכלים.
חוץ ממללים ארוכים האתר CSSGuide נותן דוגמאות CSS למגוון מאפיינים.
CSS:
HTML:

דוגמא: מגדיר בצורה נפרדת לאורך ולרוחב איך להציג את התוכן של האלמנט, כאשר התוכן לא נכנס במימדי האלנמנט וגולש אל מחוץ לאלמנט.

Demo Panel:
זהו מלל (טקסט) ארוך ארוך המאפשר להדגים מצב בו המלל הוא ארוך.
מצב בו אורך המלל הוא גדול נותן אפשרות להציג את הדוגמא בצורה טובה להבנת ההדגמה.
צוות האתר CSSGuide כתב את דוגמא זו על מנת להדגים בצורה טובה את הדוגמא.
דוגמא זו נכתבה על מנת לתת מענה לדוגמאות המצריכות מלל ארוך.
לפעמים בשביל להדגים בצורה הכי טובה יש לתת דוגמא עם הרבה מילים ושורות.
על מנת לכתוב מלל ארוך, צוות האתר השתמש במיטב הכלים.
חוץ ממללים ארוכים האתר CSSGuide נותן דוגמאות CSS למגוון מאפיינים.
CSS:
HTML:
אודות | הצהרת פרטיות | צור קשר