الدرس السابع: إدراج الصور في HTML

ما هي الصور في HTML؟

تُعد الصور جزءًا مهمًا من تصميم الصفحات الإلكترونية. يتم إدراج الصور باستخدام العنصر <img>، وهو عنصر ذاتي الإغلاق (لا يحتاج إلى وسم إغلاق).

كيفية إدراج صورة:

<img src="image-path.jpg" alt="وصف الصورة">

مثال على إدراج صورة:

<img src="https://www.example.com/image.jpg" alt="صورة توضيحية">

ضبط حجم الصورة:

<img src="https://www.example.com/image.jpg" alt="صورة توضيحية" width="300" height="200">

إدراج صورة كرابط:

    <a href="https://www.example.com">

        <img src="https://www.example.com/image.jpg" alt="صورة توضيحية">

    </a>

    

إضافة إطار للصورة باستخدام CSS:

<img src="https://www.example.com/image.jpg" alt="صورة توضيحية" style="border: 2px solid black; border-radius: 5px;">

الخلاصة:

في هذا الدرس تعلمنا كيفية إدراج الصور في HTML، وضبط حجمها، وإضافة تنسيقات أو تحويلها إلى روابط قابلة للنقر.