سينتاكس Academy

الرئيسية
الكورسات
تسجيل الدخول

54 Media Queries

تعلم css كاملة في 2025 0%

قسم 1 – الأساسيات (1 – 27)

27 ▼

○

1 - مقدمة عن كورس ال css | ماهي ال css وما الفائده من استخدامها

0د

○

2- ازاي اكتب الكود واماكن كتابه كود ال css | كورس CSS

0د

○

3 - ماهو ال id وال class وما الفرق بينهما مع مثال عملي | كورس css

0د

○

4 - ترتيب الأولويات في CSS: فهم تأثير class, id, العناصر المستهدفة، والنمط العالمي على تصميم موقعك

0د

○

5 - شرح تفصيلي لألوان الخلفية في CSS | كيفية استخدام background-color لتصميم احترافي | كورس css

0د

○

6 - إتقان ألوان الخلفية في CSS: فهم وتطبيق HSL، RGBA، والألوان الست عشرية | كورس CSS

0د

○

7 - فهم وتطبيق خاصية width في CSS: التحكم في عرض العناصر بفعالية | كورس CSS

0د

○

8 - إتقان خاصية height في CSS: كيفية التحكم في ارتفاع العناصر بمرونة | كورس CSS

0د

○

9 - هم مستويات display في CSS: التحكم في طريقة عرض العناصر بذكاء 🧠| block, inline inline-block, none

0د

○

10 - إتقان خاصية margin في CSS: التحكم في المسافات الخارجية للعناصر | كورس CSS

0د

○

11 - فهم خاصية padding في CSS: كيفية التحكم في المسافات الداخلية للعناصر | كورس CSS

0د

○

12 - فهم وتطبيق خاصية border في CSS: كيفية التحكم في حدود العناصر | كورس CSS

0د

○

13- إتقان خاصية box sizing في CSS كيفية التحكم في حجم العناصر بدقة | كورس CSS 2

0د

○

14 - فهم خاصية outline في CSS التحكم في الإطار الخارجي للعناصر | كورس CSS

0د

○

15 - إتقان خاصية border-radius في CSS: كيفية إنشاء الزوايا المنحنية للعناصر | كورس CSS

0د

○

16 - إضافة العمق والجاذبية بتطبيق box shadow في CSS دليل شامل | كورس CSS

0د

○

17 - كيفية تعليق الأكواد مؤقتًا في CSS باستخدام التعليقات | كورس CSS

0د

○

18 - تأثيرات النصوص في CSS: التحكم في المحاذاة، التزيين، والتحويل | الجزء الأول - كورس CSS

0د

○

19 - تأثيرات النصوص في CSS: التباعد والظلال | الجزء الثاني | كورس CSS

0د

○

20 - تأثيرات النصوص في CSS: التحكم في المسافات البيضاء Wrap و No-wrap | ومراجعة شاملة - كورس CSS

0د

○

21 - التحكم في الخطوط في CSS: استدعاء الخطوط الخارجية وفهم فكرة الخطوط | كورس CSS

0د

○

22 - أستخدام أيقونات باستخدام CSS وأنشاء تصميم بسيط وتطبيق عملي علي ال CSS | أنشاء تصميم بسيط css

0د

○

23 - إتقان الخلفيات في CSS: إضافة الصور والتحكم في التكرار | كورس css

0د

○

24 - التحكم في حجم وموقع الخلفية وثباتها في وbackground-attachment CSS | background-position

0د

○

25 - الكتابة المختصرة للخصائص: background shorthand في CSS shorthand

0د

○

26 - الشفافية باستخدام خاصية Opacity في CSS

0د

○

27 - التحكم في الحجم الأقصى للعناصر: max-width و max-height في CSS

0د

قسم 2 – المستوى المتوسط (28 → 32)

5 ▼

○

28- شرح خاصية Overflow في CSS – التحكم في المحتوى الزائد ببساطة!

0د

○

29- ما هي CSS Combinators؟ شرح العلاقات بين العناصر في CSS

0د

○

30- هتتحكم في أي عنصر بـ سطر واحد! 💡 CSS Attribute Selectors

0د

○

31- CSS Pseudo Classes – تحكّم ذكي بالعناصر بلمسة واحدة!

0د

○

32 - CSS Pseudo-Elements – قوة before و after لتزيين المحتوى!

0د

قسم 3 – الموضع (Positioning)

6 ▼

○

33 - CSS Position Static vs Relative – الأساس والحركة داخل التدفق

0د

○

34 - CSS Position Absolute – التموضع الحر داخل الحاوية

0د

○

35 - CSS Position Fixed – العناصر الثابتة أثناء التمرير

0د

○

36 - شرح CSS Position Sticky عمليًا: كيف تجعل العناصر تلتصق أثناء التمرير؟

0د

○

37 - كل ما يخص z-index في CSS فهم طبقات العناصر ومنع التداخل غير المرغوب

0د

○

38 - CSS Float ببساطة كيفية تحويم العناصر وترتيب النص حولها

0د

قسم 4 – فلكس بوكس و جريد (Flexbox & Grid)

15 ▼

○

39 - مقدمة Flexbox: فهم اتجاه العناصر باستخدام flex-direction

0د

○

40 – توزيع العناصر وتحديد المسافات باستخدام justify-content و gap في Flexbox

0د

○

41 – flex wrap و flex flow لف العناصر وتحديد اتجاهها في Flexbox

0د

○

42 – الفرق بين align-items و align-content في Flexbox (مع أمثلة توضّح الفرق بوضوح)

0د

○

43 التحكم في توسّع العناصر داخل Flex – شرح flex grow بالتفصيل

0د

○

44 - flex-shrink – متى وكيف تنكمش العناصر داخل الحاوية؟

0د

○

45 – flex-basis وكتابة flex المختصرة ضبط الأساس والحجم في سطر واحد

0د

○

46 – order إعادة ترتيب عناصر Flexbox بدون لمس الـ HTML

0د

○

47 – align-self تخصيص محاذاة عنصر واحد داخل Flexbox

0د

○

48 – CSS Grid التحكم في الأعمدة والصفوف باستخدام grid-template-columns, grid-template-rows وrepeat()

0د

○

49 – التحكم في تموضع العناصر داخل Grid باستخدام grid-row, grid-column وgrid-area

0د

○

50 – توزيع المساحات في CSS Grid باستخدام `fr`, `minmax()`، و`grid-gap

0د

○

51 – تصميم تخطيطات احترافية باستخدام `grid-template-areas` و `grid-area`

0د

○

🧲 52 - الانتقالات البسيطة باستخدام transition في CSS

0د

○

🧠 53 - المتغيرات (CSS Variables) في CSS – ازاي تستخدمها وتنظم كودك

0د

قسم 5 – التصميم المتجاوب (Responsive Design)

2 ▼

55 - وحدات القياس النسبية في CSS ‎(%‎ | vw | vh) – ازاي تتحكّم في أبعاد العناصر على أي شاشة

0د

قسم 6 – المشاريع العملية

1 ▼

○

تصميم كامل ب HTML - CSS فقط | تصميم بطاقة منتج جذابة خطوة بخطوة (كارت أنيق + زر شراء تفاعلي)

0د

الانتقال للدرس التالي...

تقييم الكورس

★ ★ ★ ★ ★

الإبلاغ عن مشكلة

×

الاسم *

البريد الإلكتروني *

وصف المشكلة *

سيتم إرسال رابط هذه الصفحة تلقائياً مع البلاغ

تواصل معنا
من نحن
سياسة الخصوصية
شروط الاستخدام