📚 معلومات الصفحة
الكتاب: كتاب التقنية الرقمية - الصف 11 - الفصل 1 | المادة: التقنية الرقمية | المرحلة: الصف 11 | الفصل الدراسي: 1
الدولة: المملكة العربية السعودية | المنهج: المنهج السعودي - وزارة التعليم
نوع المحتوى: درس تعليمي
📝 ملخص الصفحة
📚 إنشاء زر باستخدام جافا سكريبت
المفاهيم الأساسية
وظيفة جافا سكريبت (Function): كتلة من التعليمات البرمجية تُنفذ عند استدعائها. تُعلن داخل الأقواس المتعرجة `{}`.
خريطة المفاهيم
```markmap
تصميم الموقع الإلكتروني
الموقع الإلكتروني المستجيب
التصميم المستجيب
#### الأدوات
##### استعلامات الوسائط (Media Queries)
###### أماكن الاستخدام
####### داخل ملف HTML (CSS الداخلي)
######## مثال تطبيقي
######### تدريب 2
########## المطلوب: إضافة استعلام وسائط إلى مقطع HTML معطى
########## الشرط: `@media screen and (max-width: 600px)`
########## الإجراء: (يجب على الطالب تحديده)
########## المقطع البرمجي الأساسي
########### يحتوي على:
###########- إعدادات الصفحة (``، `dir="rtl"`)
###########- تنسيق CSS داخلي (لون خلفية `grey`)
###########- محتوى HTML (`
`، `
`)
######### تدريب 3
########## المطلوب: تنسيق جزء `div` معين
########## التنسيقات المطلوبة:
###########- ضبط الهامش (Margin): 20 بكسل
###########- تلوين النص: أخضر
###########- ضبط الحدود (Border): 3 بكسل، لون أسود، ثابت (Solid)
###########- إضافة استعلام وسائط: لتغيير لون الخلفية إذا كانت الشاشة أصغر من 600 بكسل
########## المقطع البرمجي الأساسي
########### يحتوي على:
###########- إعدادات الصفحة (``، `dir="rtl" lang="ar"`)
###########- تنسيق CSS داخلي (لون خلفية `lightgrey` للعنوان `h1`)
###########- محتوى HTML (`
`، `
`، `
######### تدريب 4
########## المطلوب: تنسيق صورة في موقع إلكتروني
########## التنسيقات المطلوبة:
###########- ضبط عرض الصورة: 150 بكسل
###########- ضبط ارتفاع الصورة: 100 بكسل
###########- ضبط خاصية نصف قطر الإطار (border-radius): 5 بكسل
###########- استخدام استعلامات الوسائط: لتغيير حجم الصورة إذا كانت الشاشة أصغر من 500 بكسل
########## المقطع البرمجي الأساسي
########### يحتوي على:
###########- إعدادات الصفحة (``، `dir="rtl" lang="ar"`)
###########- قسم `