هذا الدرس من الدورة التدريبية: دورة تدريبية لغة CSS لإنشاء تصاميم وتنسيق صفحات الإنترنت
الدرس: التنسيق وحفظ التعديلات فى صفحة الويب على أدوات مطورين المتصفح
المدة: 5 دقائق
وصف مختصر:
في هذا الدرس من دورة CSS، ستتعلم كيفية تمكين التعديلات المحلية في Google Chrome والحفاظ على تحديثات ملفاتك، بالإضافة إلى تحسين الأنماط لتصميم مواقع ويب احترافية.
وصف الدرس
تمكين التعديلات المحلية وتحسين أنماط CSS
في هذا الدرس المميز من دبلومة تطوير الويب، ستتعرف على كيفية استخدام ميزة التعديلات المحلية في Google Chrome،
التي تتيح لك تعديل ملفات CSS مباشرةً في المتصفح دون فقدان التحديثات.
كما سنلقي الضوء على تحسين أنماط CSS لتحسين تجربة المستخدم وتصميم واجهات ويب مبتكرة.
ما هي ميزة التعديلات المحلية في Google Chrome؟
التعديلات المحلية (Local Overrides) هي أداة قوية تتيح لك حفظ التعديلات على ملفات CSS وJavaScript مباشرة من أدوات المطور في المتصفح.
يمكنك إجراء تغييرات في الوقت الفعلي دون الحاجة إلى إعادة تحميل الملفات أو تغييرها على الخادم.
لماذا يعتبر هذا الدرس مهمًا؟
- يوفر لك الوقت والجهد أثناء تطوير وتصحيح الأخطاء في مواقع الويب.
- يساعدك على تحسين جودة الكود وتنظيم الأنماط بشكل أفضل.
- يمكنك من إنشاء تصميمات أكثر استجابة ومرونة بفضل تحسينات CSS.
خطوات تمكين التعديلات المحلية
- افتح Google Chrome وانتقل إلى أدوات المطور (DevTools) بالضغط على
Ctrl + Shift + I
أوF12
. - انتقل إلى علامة تبويب "Sources" وحدد "Overrides" في القائمة الجانبية.
- حدد مجلدًا على جهاز الكمبيوتر الخاص بك لحفظ التعديلات.
- قم بإجراء التعديلات على ملفات CSS أو JavaScript وستُحفظ التغييرات تلقائيًا.
تحسين أنماط CSS
بجانب التعديلات المحلية، سنشرح لك كيفية تحسين أنماط CSS باستخدام أدوات متقدمة مثل:
- إعداد Media Queries لتصميمات متجاوبة.
- استخدام خصائص متطورة مثل
grid
وflexbox
. - تحسين الأداء من خلال تقليل التكرار واستخدام المتغيرات.
انضم الآن واحصل على شهادة معتمدة!
دبلومة تطوير الويب تمنحك المهارات التي تحتاجها للتميز في سوق العمل.
أكمل هذا الدرس لتتقن أساسيات CSS المتقدمة واحصل على شهادة معتمدة تثبت خبرتك.
انضم الآن وابدأ رحلتك الاحترافية معنا!
الفيديوهات
سجل دخول وتأكد من اشتراكك في هذا البرنامج الدراسي للوصول إلى الأدوات والمواد التدريبية و الفيديوهات
فيديو الدرس التعليمي التنسيق وحفظ التعديلات فى صفحة الويب على أدوات مطورين المتصفح
المصادر
سجل دخول وتأكد من اشتراكك في هذا البرنامج الدراسي للوصول إلى الأدوات والمواد التدريبية و المصادر
أوامر تنسيق عناصر هيكل صفحة الويب
ملحقات ال PDF
سجل دخول وتأكد من اشتراكك في هذا البرنامج الدراسي للوصول إلى الأدوات والمواد التدريبية و ملحقات ال PDF
Css كتاب شرح مساعد لفهم أساسيات :Float .Display,filter,min_width,min_height
الدروس والاختبارات لتعلم هذه الدورة التدريبية : دورة تدريبية لغة CSS لإنشاء تصاميم وتنسيق صفحات الإنترنت