מפרומפט לדף נחיתה
בונים את מדור ה-Hero הראשון שלכם
מדור ה-Hero הוא החלק החשוב ביותר בדף נחיתה של תיק עבודות — זה הדבר הראשון שהמבקרים רואים. בשיעור הזה תיצרו מדור Hero מקצועי שתופס את העין וגורם למבקרים לרצות להכיר אתכם.
תתחילו מ-HTML בסיסי ותוסיפו עיצוב עם Tailwind CSS כדי ליצור Hero מודרני על רקע גרדיאנט, עם כותרת סוחפת, כותרת משנה וכפתור קריאה לפעולה. זה הבסיס של כל אתר תיק עבודות מצוין.
הוראות
הוסיפו div עוטף ל-Hero עם min-h-screen, רקע גרדיאנט (from-purple-900 עד gray-900) ומרכוז עם flex
רמז: השתמשו ב: `<div class="min-h-screen bg-gradient-to-br from-purple-900 via-gray-900 to-gray-900 flex items-center justify-center px-4">` — כך נוצר מדור בגובה מסך מלא עם הגרדיאנט שלכם
בתוך ה-Hero, הוסיפו כותרת h1 עם השם שלכם ופסקת p עם התפקיד שלכם
הוסיפו פסקת תיאור (תגית p) עם משפט קצר על מה שאתם עושים (עד 300 תווים)
הוסיפו כפתור קריאה לפעולה (CTA) עם עיצוב גרדיאנט ואפקטים במעבר עכבר
הקוד שלכם
תארו מה אתם רוצים לבנות בשלב הזה ואני אכתוב את הקוד — ואז לחצו על החלה כדי לשבץ אותו בעורך שלכם. השלב הזה: הוסיפו div עוטף ל-Hero עם min-h-screen, רקע גרדיאנט (from-purple-900 עד gray-900) ומרכוז עם flex