انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #8 من درس: الصور في لغة HTML

Animated Images in HTML الصور المتحركة في لغة HTML

في هذا الدرس، ستتعلم كيفية التعامل مع الصور في HTML، بما في ذلك كيفية بناء الجملة لإضافة الصور وخصائصها مثل [src] و [alt] و [title]، ومعرفة الفرق بينها، بالإضافة إلى ضبط أبعاد الصور واستخدامها كرابط واضافة الصور المتحركة. سنستعرض أيضاً عنصر <picture> وكيفية استخدامه بفعالية.
1 صفوف تعليمية
لغة HTML
35,376 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تسمح لغة HTML بإضافة صور متحركة داخل مواقع الويب، وذلك باستخدام تنسيق الصور المتحركة المعروف بـ GIF اختصارًا لـ [Graphics Interchange Format].

يمكن أن يوضح GIF الحركة عندما تخدم المحتوى؛ الجاذبية ليست خاصية مضمونة للتنسيق. وتدعم تنسيقات أخرى الحركة مثل APNG وWebP. ويُستخدم امتداد [gif.] للإشارة إلى هذا النوع من الملفات.

طريقة استخدام الصور المتحركة:

  • نحدد مسار الصورة متبوعًا باسم الملف الذي يحتوي على اسم الصورة وامتدادها. على سبيل المثال، إذا كان اسم الصورة [programming] والامتداد [gif]، يُكتب اسم الملف كالتالي: [programming.gif].
الصور المتحركة في لغة HTML

Image Animated Syntax

أضف صورة متحركة إلى مجلد المشروع، ثم أدخل المسار الكامل للصورة متبوعًا باسم الملف الذي يتضمن امتداد [gif.].

HTML 
<img src="https://www.closetag.com/images/programming.gif" alt="Programmer" width="200" height="200" title="Programmer">
جرّب بنفسك

جميع فقرات هذا الدرس (الصور في لغة HTML)