מושגי יסוד ב-CSS

Podcast

Play an AI-generated podcast conversation about this lesson

Download our mobile app to listen on the go

Get App

Questions and Answers

מהי ההתנהגות של אלמנטים מסוג `block` ב-CSS?

מקבלים את המימדים שלהם מהאבא.
צפים שמאלה או ימינה מחוץ ל-`normal flow`.
תופסים את כל השורה. (correct)
תופסים עמודה בשורה.

הערך `display: inline` מאפשר לתת לאלמנט גובה ורוחב ספציפיים.

False (B)

מה ההבדל העיקרי בין `visibility: hidden` לבין `display: none`?

visibility: hidden שומר על המקום של האלמנט בדף, ואילו display: none מסיר אותו לחלוטין.

אלמנטים שהם _____ יצופו שמאלה או ימינה מחוץ ל-`normal flow` וישפיעו על האלמנטים שאחריהם.

float Signup and view all the answers

התאם את סוג האלמנט להתנהגות ברירת המחדל שלו:

block = תופס שורה שלמה inline = תופס עמודה בשורה inline-block = דומה ל-inline אך ניתן להגדיר גובה ורוחב Signup and view all the answers

מה קובעת תכונת ה-`display` ב-CSS?

איך הקופסא של האלמנט מתנהגת. (B) Signup and view all the answers

ב-`normal flow`, תגיות מוצגות לפי הסדר שבו הן כתובות בקוד ה-HTML.

True (A) Signup and view all the answers

מה היתרון בשימוש ב-`inline-block` לעומת `inline`?

ניתן להגדיר גובה ורוחב לאלמנט <code>inline-block</code>. Signup and view all the answers

איזה מבין סוגי האלמנטים הבאים לא תופס מקום כלל כאשר משתמשים בערך `none` במאפיין `display`?

כל התשובות נכונות (D) Signup and view all the answers

כאשר רוצים למקם אלמנט על אלמנט אחר שלא ב-`normal flow` נשתמש ב-_____.

Positioning Signup and view all the answers

מהי ההתנהגות של אלמנט HTML עם המאפיין `position: static`?

האלמנט תופס את המקום הבא בדף כחלק מה-Normal flow. (A) Signup and view all the answers

המאפיין `position: relative` בפני עצמו גורם לאלמנט לשנות את מיקומו הויזואלי בדף.

False (B) Signup and view all the answers

באילו תכונות יש להשתמש יחד עם `position: relative` על מנת לשנות את מיקום האלמנט?

<code>top</code>, <code>bottom</code>, <code>left</code>, <code>right</code> Signup and view all the answers

אלמנט עם `position: absolute` שאינו מכיל הורה עם מיקום שאינו `static` ימוקם ביחס ל- ____________.

<code>body</code> Signup and view all the answers

מה קורה כאשר משנים את המאפיין `position` ל-`absolute`?

האלמנט הופך להיות 'צף' ואינו משאיר מקום במסמך. (D) Signup and view all the answers

התכונות הבסיסיות של אלמנט (רוחב, גובה) תמיד נשמרות כאשר משנים את מיקומו ל-`absolute`.

False (B) Signup and view all the answers

התאם את ערכי ה-`position` לתDESCRIPTION המתאים:

<code>static</code> = :האלמנט ממוקם בזרימה הרגילה של המסמך. <code>relative</code> = :האלמנט ממוקם ביחס למיקומו המקורי. <code>absolute</code> = :האלמנט ממוקם ביחס לאלמנט האב הממוקם הקרוב ביותר. <code>fixed</code> = :האלמנט נשאר במקום קבוע גם כאשר גוללים את המסך. <code>sticky</code> = :האלמנט נע בין <code>relative</code> ל-<code>fixed</code> בהתאם למיקום הגלילה. Signup and view all the answers

מה תפקידו של המאפיין `z-index`?

קובע את סדר הערימה (stacking order) של אלמנטים חופפים. (D) Signup and view all the answers

`z-index` עובד על כל סוגי האלמנטים, ללא תלות במאפיין ה-`position` שלהם.

False (B) Signup and view all the answers

מה יקרה אם שני אלמנטים חופפים ואין להם מאפיין `z-index` מוגדר?

האחרון בקוד יעלה על הקודם. Signup and view all the answers

מה ההבדל בין `position: absolute` לבין `position: fixed`?

<code>absolute</code> ממוקם ביחס לאלמנט האב, ואילו <code>fixed</code> ממוקם ביחס לחלון הדפדפן. (B) Signup and view all the answers

אלמנט עם `position: fixed` ממוקם ביחס ל ____________.

חלון הדפדפן Signup and view all the answers

מהו היתרון העיקרי בשימוש ב-`position: sticky`?

הוא מאפשר ליצור אפקט של אלמנט 'נדבק' לגלילה רק כאשר הוא מגיע לנקודה מסוימת. (C) Signup and view all the answers

אלמנט עם `position: sticky` תמיד יהיה גלוי על המסך, ללא תלות במיקום הגלילה.

False (B) Signup and view all the answers

בין אילו שני ערכים `position: sticky` נע?

<code>relative</code> ו-<code>fixed</code> Signup and view all the answers

Flashcards

Normal Flow

הסדר שבו התגיות מוצגות בדף, אחת אחרי השנייה, לפי הופעתן בקוד.

אלמנט Block

תגיות שתופסות שורה שלמה בדף (כמו div, p, h).