בשיעור הזה תלמדו איך לשתף ולהציג את הדרך המועדפת עליכם למרכז ב-CSS.
קראו את הפוסט בבלוג שלי Centering in CSS כדי ללמוד על 5 הדרכים האהובות עליי למרכז ב-CSS. או לצפות בסרטון הזה!
הגדרה
- לוחצים על רמיקס לעריכה כדי שיהיה אפשר לערוך את הפרויקט.
- פתיחה של
app/index.html
- ב-
line 23
, מחליפים את/* your centering CSS here /*
בשירות ה-CSS - (אופציונלי) נותנים שם לטכניקת הריכוז ומחליפים את הטקסט ב
<h1>
סגנונות
- יצירת קובץ חדש בתיקייה
app/css/
- יצירת בורר כדי להחזיק את פתרון המרכז, כמו
.turbo-center
או[floaty-mcfloat]
- בתוך הבורר החדש, כתבו את טכניקת הריכוז שלכם (אל תהססו להסתכל על השיטות האחרות ב-
app/css/
כדוגמאות) - (אופציונלי) כותבים כמה "סגנונות תמיכה" כדי שנוכל לראות אילו ילדים צריכים סגנונות כדי לתמוך במרכוז
- יש לפתוח את
app/css/index.css
ולייבא את הקובץ החדש בחלק התחתון של המסך
כל מה שצריך
- פתיחה מחדש של
app/index.html
- מאתרים את השדה
<article>
ומציבים לו את הבורר המותאם אישית שיצרתם בשלב 2 בקטע הקודם. - שלחו לי ציוץ את הגליץ' שלכם ואני אפרסם אותו בפוסט בבלוג!