دورة HTML - الدرس الخامس ( الصور و الجداول )
| <!DOCTYPE html> <html> <body><p> صورة<img src="https://www.w3schools.com/html/smiley.gif" alt="Smiley face" width="32" height="32"></p><p> صورة متحركة : <img src="https://www.w3schools.com/html/hackanm.gif" alt="Computer man" width="48" height="48"></p><p> كود وضع صورة متحركة هو نفسه كود وضع صورة ثابتة</p></body> </html> |
هنا كيفية ظهور الكود :صورة:
صورة متحركة : 
كود وضع صورة متحركة هو نفسه كود وضع صورة ثابتة
صور HTML - وسم <img> :
في لغة ال HTML نعرف الصور عن طريق الوسم <img> هذا الوسم ليس لديه محتوى و ليس لديه وسم اغلاق كما في الوسوم الاخرى
من أجل اظهار الصورة داخل الوسم نستعمل src و هي اختصار ل source و يكون داخلها رابط الصورة
الصيغة الخاصة بالصور في لغة html :
<img src="رابط الصورة" alt="نص">
|
في رابط الصورة ممكن نضع الرابط كاملا و يمكننا أيضا وضع اسم الصورة مثلا image.jpg اذا كانت على نفس مكان صفحة ال html
يمكننا أيضا وضع صورة ثابتة أو متحركة jpg , png , gif .....
اضافة الطول و العرض (Height and Width ) :
height و width يستعملان لتخصيص طول و عرض الصورة على صفحة الHTML و وحدتها البيكسل في الاعدادات الافتراضية
<img src="dzlearning.jpg" alt="dzlearning" width="304" height="228">
|
في هذا المثال وضعنا طول و عرض لصورة اسمها dzlearning.jpg بطول 228 بيكسل و عرض 304 بيكسل ايضا
الجداول في لغة HTML :
| الاسم الاول | اسم العائلة | النقطة |
| عبد الجليل | بومامش | 18 |
| سمير | عطاري | 15 |
| عبد الباسط | بحمو | 12 |
- يعرف الجدول عن طريق الوسم <table>
- يقسم الجدول الى صفوف ( rows ) عن طريق الوسم <tr> و كل صف من الصفوف يمكن تقسيمه الى خلايا (cells)
عن طريق الوسم <td> - يمكننا في الجدول ادراج صور ، نص ، روابط ، قوائم ، جداول اخرى ...
مثال جدول :
| <table border="1"> <tr> <td>صف 1, خلية 1</td> <td>صف 1, خلية 2</td> </tr> <tr> <td>صف 2, خلية 1</td> <td>صف 2, خلية 2</td> </tr> </table> |
table border يمثل سمك حدود الجدول يمكن اذا لم نكتبها فالجدول سيأخذ القيمة 0 حسب الاعدادات الافتراضية
رأس الجدول :
نعرف رأس الجدول عن طريق الوسم <th> أي table header
| <table border="1"> <tr> <th>Header 1</th> <th>Header 2</th> </tr> <tr> <td>صف 1, خلية 1</td> <td>صف 1, خلية 2</td> </tr> <tr> <td>صف 2, خلية 1</td> <td>صف 2, خلية 2</td> </tr> </table> |
الى هنا ينتهي هذا الدرس الى دروس اخرى نستودعكم الله الذي لا تضيع ودائعه ..
لاتنسونا من صالح دعائكم
السلام عليكم اخي انا عندي سؤال كيف نحط صورة في أحد الخلاية ارجو رد قريبا هدا على بريد الكتروني
ردحذفsedahmed911@gmail.com
انا مثلك اذا تعرف رد zainzainalabden@gmail.com
حذفهذا التلكرام = z_98_x