עכשיו נלמד כיצד ניתן לשנות את צבע הטקסט של כותרות העמוד H1 לצבע כחול כהה, באמצעות ה- CSS:

h1 {color: #24A8D0;}

אתם בטח שאולים את עצמכם איך אני יודע את הצבעהרקע הנ"ל, לכן ישנה אפשרות נוספת של כתיבת הצבע בשפה האנגלית, ראה דוגמא:

h1 {color: blue;}

  • גלריית אתרי תדמית

צרו קשר עכשיו לקבלת הצעת מחיר!

צבע רקע

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

body {background-color: #24A8D0;}

או לחלופין ניתן לכתוב את שם צבע הרקע שאנחנו מעוניינים, כמו בדוגמא הקודמת:

body {background-color: blue;}

תמונת רקע

באמצעות קוד CSS ניתן לשלב תמונת רקע באתר, כמו שאנחנו מוסיפים את התמונות בקוד HTML ניתן לעשות זאת גם באמצעות CSS ע"י הוספת האלנטים הבאים:

body {background-image: url("images/logo.png");}

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

background-repeat: repeat-x – התמונה חוזרת אופקית

background-repeat: repeat-y – התמונה חוזרת אנכית

background-repeat: no-repeat – התמונה מופיע פעם אחת

ניתן להגדיר אורך ורוחב לתמונה באמצעות הפקודות הבאות:

width:32px;height:32px;

לסיכום

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

h1 {color: #24A8D0;}
body {background-color: #24A8D0;}
body {background-image: url("images/logo.png");width:32px;height:32px;background-repeat: repeat-x}