תמונות רקע ב – CSS

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

  1. body {
  2.     background: white url(../../images/img02.gif) no-repeat top right;
  3. }

הדוגמא הנ"ל מאחדת את התכונות הבאות :

  • background-color – מציינת את צבע הרקע בעמוד HTML כלשהו.
  • Background-image – מציינת את הנתיב של תמונת הרקע בעמוד HTML כלשהו.
  • Background-repeat – מציינת האם התמונה תשוכפל על גבי עמוד ה- HTML. תכונה זו יכולה לקבל 3 ערכים :
    • repeat-y – חזרה על ציר ה – Y.
    • repeat-x – חזרה על ציר ה – X.
    • no-repeat - ללא חזרה כלל.
  • Background-position – מציינת את מיקום התמונה, תכונה זו יכולה לקבל את הערכים הבאים : top, center, bottom, left, right או כל שילוב הגיוני שלהם.

ניתן להחיל את התכונות הנ"ל על רוב האלמנטים בשפת HTML ולא רק על אלמנט ה – body.

עמודים רלוונטים

דוגמאות קוד

  • תמונות רקע ב – CSS
  • רקע ב – CSS – שימוש בתכונה background-repeat.
  • פינות מעוגלות ב- CSS 1– שימוש בתמונות רקע קטנות יותר ליצירת האפקט.
  • פינות מעוגלות ב- CSS 2 – תיבות טקסט ושימוש בתמונות רקע.

רפרנס

  • התכונה background
  • התכונה background-image
  • התכונה background-repeat
  • התכונה background-position