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

צבע רקע

עריכה

על מנת ליצור צבע רקע, נשתמש בקוד הבא:

CSS_SELECTOR{
background-color: colorname;
}

כאשר colorname יכול להיות שם הצבע באנגלית, או הקוד הקסאדצימלי שלו. כמובן שאפשר לוותר על ה-color ולכתוב רק background:

CSS_SELECTOR{
background: colorname;
}

תמונת רקע

עריכה

על-מנת ליצור תמונת רקע:

CSS_SELECTOR{
background-image: url(image.ext);
}

(ניתן להגדיר שיהיה תמונת רקע נוספת מתחת לתמונת רקע, ע"י הוספה בסוגריים פסיק ושם הקובץ הנוסף)


כאשר image.ext מסמל את המיקום של התמונה כולל סיומת לדוגמא gif. או png. גם עכשיו אפשר לכתוב רק background:

CSS_SELECTOR{
background: url(image.ext);
}

מאפיינים שונים לתמונת רקע

עריכה

המבנה של מאפיין:

CSS_SELECTOR{
background: url(image.ext) [propery_value[,propery2_value]];
}

מקבל את הערכים הבאים: repeat-y : מכפיל את התמונה לאורך ציר ה-y, כמספר הפעמים שצריך כדי למלא את האלמנט. repeat-x : כנ"ל רק עם ציר ה-x‏. repeat (ללא ציון x וגם ללא ציון y): גם בציר ה-x וגם בציר ה-y. ‏no-repeat : בכלל לא.

position

עריכה

left
right
top
bottom


הפרק הקודם:
ריווח
רקעים הפרק הבא:
שכבות