تعلم css كاملة في 2025
دورة شاملة تغطي أساسيات css بشكل عملي ومبسط، من البداية حتى الاحتراف.
برمجة 56 دروس • 5 س
💡 ملاحظة: الكورس لازال مستمرا في التحديث .. أبقي أطلاع
ماذا ستحصل عليه في هذه الدورة
هل تريد تعلم css من الصفر حتى الاحتراف؟ هذه الدورة مخصصة لك! سنتعلم معًا كيفية إنشاء صفحات ويب باستخدام css، تنظيم المحتوى واستخدام الأكواد بطريقة صحيحة. ستتعرف على: أساسيات تنسيق الصفحات باستخدام CSS كيفية التحكم في الألوان، الخطوط، والخلفيات بناء واجهات مستخدم أنيقة وسريعة الاستجابة
الوصول مدى الحياة
تحديثات مجانية
محتوى الدورة
.png)
قسم 1 – الأساسيات (1 – 27)
1 - مقدمة عن كورس ال css | ماهي ال css وما الفائده من استخدامها
مشاهدة
2- ازاي اكتب الكود واماكن كتابه كود ال css | كورس CSS
مشاهدة
3 - ماهو ال id وال class وما الفرق بينهما مع مثال عملي | كورس css
مشاهدة
4 - ترتيب الأولويات في CSS: فهم تأثير class, id, العناصر المستهدفة، والنمط العالمي على تصميم موقعك
مشاهدة
5 - شرح تفصيلي لألوان الخلفية في CSS | كيفية استخدام background-color لتصميم احترافي | كورس css
مشاهدة
6 - إتقان ألوان الخلفية في CSS: فهم وتطبيق HSL، RGBA، والألوان الست عشرية | كورس CSS
مشاهدة
7 - فهم وتطبيق خاصية width في CSS: التحكم في عرض العناصر بفعالية | كورس CSS
مشاهدة
8 - إتقان خاصية height في CSS: كيفية التحكم في ارتفاع العناصر بمرونة | كورس CSS
مشاهدة
9 - هم مستويات display في CSS: التحكم في طريقة عرض العناصر بذكاء 🧠| block, inline inline-block, none
مشاهدة
10 - إتقان خاصية margin في CSS: التحكم في المسافات الخارجية للعناصر | كورس CSS
مشاهدة
11 - فهم خاصية padding في CSS: كيفية التحكم في المسافات الداخلية للعناصر | كورس CSS
مشاهدة
12 - فهم وتطبيق خاصية border في CSS: كيفية التحكم في حدود العناصر | كورس CSS
مشاهدة
13- إتقان خاصية box sizing في CSS كيفية التحكم في حجم العناصر بدقة | كورس CSS 2
مشاهدة
14 - فهم خاصية outline في CSS التحكم في الإطار الخارجي للعناصر | كورس CSS
مشاهدة
15 - إتقان خاصية border-radius في CSS: كيفية إنشاء الزوايا المنحنية للعناصر | كورس CSS
مشاهدة
16 - إضافة العمق والجاذبية بتطبيق box shadow في CSS دليل شامل | كورس CSS
مشاهدة
17 - كيفية تعليق الأكواد مؤقتًا في CSS باستخدام التعليقات | كورس CSS
مشاهدة
18 - تأثيرات النصوص في CSS: التحكم في المحاذاة، التزيين، والتحويل | الجزء الأول - كورس CSS
مشاهدة
19 - تأثيرات النصوص في CSS: التباعد والظلال | الجزء الثاني | كورس CSS
مشاهدة
20 - تأثيرات النصوص في CSS: التحكم في المسافات البيضاء Wrap و No-wrap | ومراجعة شاملة - كورس CSS
مشاهدة
21 - التحكم في الخطوط في CSS: استدعاء الخطوط الخارجية وفهم فكرة الخطوط | كورس CSS
مشاهدة
22 - أستخدام أيقونات باستخدام CSS وأنشاء تصميم بسيط وتطبيق عملي علي ال CSS | أنشاء تصميم بسيط css
مشاهدة
23 - إتقان الخلفيات في CSS: إضافة الصور والتحكم في التكرار | كورس css
مشاهدة
24 - التحكم في حجم وموقع الخلفية وثباتها في وbackground-attachment CSS | background-position
مشاهدة
25 - الكتابة المختصرة للخصائص: background shorthand في CSS shorthand
مشاهدة
26 - الشفافية باستخدام خاصية Opacity في CSS
مشاهدة
27 - التحكم في الحجم الأقصى للعناصر: max-width و max-height في CSS
مشاهدة
قسم 2 – المستوى المتوسط (28 → 32)
28- شرح خاصية Overflow في CSS – التحكم في المحتوى الزائد ببساطة!
مشاهدة
29- ما هي CSS Combinators؟ شرح العلاقات بين العناصر في CSS
مشاهدة
30- هتتحكم في أي عنصر بـ سطر واحد! 💡 CSS Attribute Selectors
مشاهدة
31- CSS Pseudo Classes – تحكّم ذكي بالعناصر بلمسة واحدة!
مشاهدة
32 - CSS Pseudo-Elements – قوة before و after لتزيين المحتوى!
مشاهدة
قسم 3 – الموضع (Positioning)
33 - CSS Position Static vs Relative – الأساس والحركة داخل التدفق
مشاهدة
34 - CSS Position Absolute – التموضع الحر داخل الحاوية
مشاهدة
35 - CSS Position Fixed – العناصر الثابتة أثناء التمرير
مشاهدة
36 - شرح CSS Position Sticky عمليًا: كيف تجعل العناصر تلتصق أثناء التمرير؟
مشاهدة
37 - كل ما يخص z-index في CSS فهم طبقات العناصر ومنع التداخل غير المرغوب
مشاهدة
38 - CSS Float ببساطة كيفية تحويم العناصر وترتيب النص حولها
مشاهدة
قسم 4 – فلكس بوكس و جريد (Flexbox & Grid)
39 - مقدمة Flexbox: فهم اتجاه العناصر باستخدام flex-direction
مشاهدة
40 – توزيع العناصر وتحديد المسافات باستخدام justify-content و gap في Flexbox
مشاهدة
41 – flex wrap و flex flow لف العناصر وتحديد اتجاهها في Flexbox
مشاهدة
42 – الفرق بين align-items و align-content في Flexbox (مع أمثلة توضّح الفرق بوضوح)
مشاهدة
43 التحكم في توسّع العناصر داخل Flex – شرح flex grow بالتفصيل
مشاهدة
44 - flex-shrink – متى وكيف تنكمش العناصر داخل الحاوية؟
مشاهدة
45 – flex-basis وكتابة flex المختصرة ضبط الأساس والحجم في سطر واحد
مشاهدة
46 – order إعادة ترتيب عناصر Flexbox بدون لمس الـ HTML
مشاهدة
47 – align-self تخصيص محاذاة عنصر واحد داخل Flexbox
مشاهدة
48 – CSS Grid التحكم في الأعمدة والصفوف باستخدام grid-template-columns, grid-template-rows وrepeat()
مشاهدة
49 – التحكم في تموضع العناصر داخل Grid باستخدام grid-row, grid-column وgrid-area
مشاهدة
50 – توزيع المساحات في CSS Grid باستخدام `fr`, `minmax()`، و`grid-gap
مشاهدة
51 – تصميم تخطيطات احترافية باستخدام `grid-template-areas` و `grid-area`
مشاهدة
🧲 52 - الانتقالات البسيطة باستخدام transition في CSS
مشاهدة
🧠 53 - المتغيرات (CSS Variables) في CSS – ازاي تستخدمها وتنظم كودك
مشاهدة
قسم 5 – التصميم المتجاوب (Responsive Design)
قسم 6 – المشاريع العملية
تصميم كامل ب HTML - CSS فقط | تصميم بطاقة منتج جذابة خطوة بخطوة (كارت أنيق + زر شراء تفاعلي)
مشاهدة
ضمان استرداد المال 100%
تقدر تسترد فلوسك خلال 7 ايام وفي أي وقت لو طبقت الخطوات الي في الكورس ومحققتش نتايج !!