لغات البرمجة (Frontend)

CSS

csscourse

23 November 2025 9 وحدات
طريقة الفتـح:

Section 1: مقدمة وأساسيات CSS

معلومات

1.1 مقدمة في CSS

1.2 CSS - تركيب الجملة (Syntax)

1.3 CSS - محددات CSS (Selectors)

1.4 CSS - كيفية استخدام CSS في صفحات HTML

1.5 CSS - التعليقات (Comments)

1.6 CSS - الألوان (Colors)

1.7 CSS - ألوان RGB

1.8 CSS - ألوان HEX

1.9 CSS - ألوان HSL

Section 2: تنسيقات

معلومات

2.1 CSS - الخلفيات (Backgrounds)

2.2 CSS - الحدود (Borders)

2.3 CSS - الهوامش (Margins)

2.4 CSS - الحشوة (Padding)

2.5 CSS - الأبعاد (Width و Height)

2.6 CSS - نموذج الصندوق (Box Model)

2.7 CSS - خصائص Outline (الإطار الخارجي)

2.8 CSS - تنسيق النصوص (Text Styling)

2.9 CSS - خصائص الخطوط (Fonts)

2.10 CSS - الأيقونات (Icons)

2.11 CSS - تنسيق الروابط (Links)

2.12 CSS - تنسيق القوائم (Lists)

2.13 CSS - تنسيق الجداول (Tables)

2.14 CSS - العرض والرؤية (Display & Visibility)

2.15 CSS - الخاصية max-width

2.16 مثال تطبيقي شامل على دروس CSS

Section 3: تنسيقات متقدمة (Layout & Positioning)

معلومات

3.1 CSS - تموضع العناصر (position)

3.2 CSS - الخاصية z-index

3.3 CSS - الخاصية overflow

3.4 CSS - الخاصية float و clear

3.5 CSS - الخاصية inline-block

3.6 CSS - محاذاة العناصر (Align)

3.7 CSS - Combinators (العلاقات بين العناصر)

3.8 CSS - الطبقات الكاذبة (Pseudo-classes)

3.9 CSS - العناصر الكاذبة (Pseudo-elements)

3.10 CSS - شفافية الصور (Image Transparency)

3.11 CSS - شريط التنقل (Navigation Bar)

3.12 CSS - القوائم المنسدلة (Dropdown Menus)

3.13 CSS - صور السبرايت (Image Sprites)

3.14 CSS3 - تصميم الأزرار (Buttons)

3.15 CSS - ترقيم الصفحات (Pagination)

3.16 CSS - الأعمدة المتعددة (Multiple Columns)

3.17 CSS - خصائص واجهة المستخدم (User Interface)

Section 4: التصميم المتجاوب (Responsive Design)

معلومات

4.1 CSS - التصميم المتجاوب (Responsive Web Design)

4.2 CSS - نافذة العرض (Viewport) في التصميم المتجاوب

4.3 CSS - شبكة التصميم المتجاوب (Responsive Grid View)

4.4 CSS - استعلامات الوسائط (Media Queries)

4.5 CSS - الصور المتجاوبة (Responsive Images)

4.6 CSS - الفيديوهات المتجاوبة (Responsive Videos)

4.7 CSS - أُطر العمل في التصميم المتجاوب (RWD Frameworks)

4.8 CSS - قوالب التصميم المتجاوب (Responsive Templates)

Section 5: الرسوم المتحركة والتحولات (Animation & Effects)

معلومات

5.1 CSS - التحولات (CSS Transitions)

5.2 CSS - الرسوم المتحركة (CSS Animations)

5.3 CSS - تلميحات الأدوات (Tooltip)

5.4 CSS - معرض الصور (Image Gallery)

5.5 CSS - الخاصية object-fit

5.6 CSS - خاصية Masking (القناع / التمويه)

5.7 CSS - الظلال (Shadows)

5.8 CSS - فلاتر الصور (Image Filters)

Section 6: Flexbox

معلومات

6.1 CSS - Flexbox (الصندوق المرن)

6.2 CSS - خصائص الحاوية Flex Container

6.3 CSS - خصائص العناصر داخل Flexbox (Flex Items)

6.4 CSS - التصميم المتجاوب باستخدام Flexbox

Section 7: Grid Layout

معلومات

7.1 CSS - تصميم الشبكة (CSS Grid)

7.2 CSS - الأعمدة والصفوف في Grid

7.3 CSS - حاوية الشبكة (Grid Container)

7.4 CSS - عناصر الشبكة (Grid Items)

Section 8: CSS Variables

معلومات

8.1 CSS - المتغيرات (CSS Variables)

8.2 CSS - تجاوز المتغيرات (Overriding Variables)

8.3 CSS - استخدام متغيرات CSS مع JavaScript

8.4 CSS - استخدام المتغيرات مع Media Queries

Section 9: CSS Advanced Topics

معلومات

9.1 CSS - استخدام !important

9.2 CSS - الأولوية (Specificity)

9.3 CSS - الدوال (CSS Functions)

9.4 CSS - دوال الرياضيات (Math Functions)

9.5 CSS - الوحدات (Units)

9.6 CSS - التحويل من px إلى em