מדיה ויקי:Vector.css: הבדלים בין גרסאות בדף
קפיצה לניווט
קפיצה לחיפוש
אין תקציר עריכה |
אין תקציר עריכה |
||
שורה 10: | שורה 10: | ||
padding: 20px; | padding: 20px; | ||
border-radius: 10px; /* פינות מעוגלות */ | border-radius: 10px; /* פינות מעוגלות */ | ||
box-shadow: inset 0 0 | box-shadow: inset 0 0 20px #6d3327, 0 10px 15px rgba(0, 0, 0, 0.2); /* כהות מתגברת עד לכהות מסביב לטקסט */ | ||
transition: box-shadow 0.3s ease, transform 0.3s ease; /* מעבר חלק */ | transition: box-shadow 0.3s ease, transform 0.3s ease; /* מעבר חלק */ | ||
width: 100%; /* שמירה על רוחב מלא של התוכן */ | width: 100%; /* שמירה על רוחב מלא של התוכן */ | ||
max-width: 1200px; /* רוחב מקסימלי */ | max-width: 1200px; /* רוחב מקסימלי */ | ||
margin: 50px auto; /* מרכז את גוף האתר */ | margin: 50px auto; /* מרכז את גוף האתר */ | ||
} | |||
/* עיצוב הטקסט עצמו */ | |||
#content p { | |||
background: linear-gradient(180deg, #9b4433 0%, #6d3327 100%); | |||
padding: 15px; | |||
border-radius: 5px; | |||
} | } | ||
/* אפקט ריחוף על גוף האתר בלבד */ | /* אפקט ריחוף על גוף האתר בלבד */ | ||
#content:hover { | #content:hover { | ||
box-shadow: inset 0 0 | box-shadow: inset 0 0 25px #6d3327, 0 12px 22px rgba(0, 0, 0, 0.25); /* צל חזק יותר */ | ||
transform: translateY(-5px); /* הרמת גוף האתר בריחוף */ | transform: translateY(-5px); /* הרמת גוף האתר בריחוף */ | ||
} | } |
גרסה מ־21:29, 14 בספטמבר 2024
/* All CSS here will be loaded for users of the Vector skin */ body { background-color: #f5e6cc; /* צבע רקע חום בהיר למסגרת */ } /* עיצוב גוף האתר */ #content { background-color: #9b4433; /* צבע גוף האתר החדש */ color: #d1bf5d; /* צבע הטקסט */ padding: 20px; border-radius: 10px; /* פינות מעוגלות */ box-shadow: inset 0 0 20px #6d3327, 0 10px 15px rgba(0, 0, 0, 0.2); /* כהות מתגברת עד לכהות מסביב לטקסט */ transition: box-shadow 0.3s ease, transform 0.3s ease; /* מעבר חלק */ width: 100%; /* שמירה על רוחב מלא של התוכן */ max-width: 1200px; /* רוחב מקסימלי */ margin: 50px auto; /* מרכז את גוף האתר */ } /* עיצוב הטקסט עצמו */ #content p { background: linear-gradient(180deg, #9b4433 0%, #6d3327 100%); padding: 15px; border-radius: 5px; } /* אפקט ריחוף על גוף האתר בלבד */ #content:hover { box-shadow: inset 0 0 25px #6d3327, 0 12px 22px rgba(0, 0, 0, 0.25); /* צל חזק יותר */ transform: translateY(-5px); /* הרמת גוף האתר בריחוף */ } /* עיצוב כותרות בגוף האתר */ #content h1, #content h2, #content h3 { text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); /* צל קטן שמוסיף עומק לכותרות */ color: #d1bf5d; /* צבע הכותרות */ } /* עיצוב קישורים */ a { color: white; /* שינוי צבע הקישורים ללבן */ } a:visited { color: white; /* שינוי צבע הקישורים שביקרת בהם ללבן */ } a:hover { color: #d1bf5d; /* שינוי צבע הקישור בעת ריחוף ל-#d1bf5d */ } a:active { color: white; /* שינוי צבע הקישור כשהוא נלחץ ללבן */ }