HTML — Images

مقدمة

الصور تحسن المحتوى. دائماً استخدم alt لإتاحة الوصول.

ماذا ستتعلم؟

• أساسيات img
• خاصية alt
• صور متجاوبة
• lazy loading

الصياغة

<img src="pic.jpg" alt="وصف">

مثال

<!-- صورة أساسية -->
<img src="/public/img/sample.jpg" alt="صورة مثال" width="420">

<!-- صورة متجاوبة -->
<img src="/public/img/sample.jpg" alt="متجاوبة" style="max-width:100%;height:auto">

<!-- تحميل كسول -->
<img src="/public/img/sample.jpg" alt="Lazy" loading="lazy">

ملاحظات

• اكتب alt واضح.
• استخدم max-width:100% للتجاوب.

  جرّب بنفسك: افتح Playground: /ar/playground/html