مقاسات الصورة
لعلك لاحظت في المثال السابق أن حجم الصورة التي تم وضعها في صفحة الويب كبير جداً, والسبب في أننا لم نقم بتحديد مقاسات الصورة التي يجب أن تظهر بها في صفحة الويب, وفي هذه الحالة يقوم المتصفح بإظهار الصورة بحجمها الطبيعي الذي هي عليه في صفحة الويب, وهذا بالطبع لايؤدي إلى ظهور الصفحة بتنسيق سليم, ويتم تحديد طول الصورة وعرضها في صفحة الويب بالبيكسيل كما يلي:
وبالكود السابق نخبر المتصفح بأن يقوم بوضع الصورةdog.jpg الموجودة في مجلد يسمى images, هذا المجلد موجود في نفس المجلد الذي يحتوي على صفحة الويب, وأن تظهر الصورة في الصفحة بعرضwidth مقداره 200بيكسيل, وبارتفاعheight مقداره100بيكسيل, كما في المثال التالي:
- قم بتشغيل برنامجnotepad واكتب به نص ملفhtmlكما في الشكل التالي:
- قم بحفظ المستند بامتدادhtml. وقم بفتح المستند في متصفح الإنترنت فتظهر الصورة في صفحة الويب بالمقاسات التي قمت بتحديدها, كما في الشكل التالي:
وتستخدم الخاصيةborder في عمل إطار حول الصورة, وتحدد قيمة هذه الخاصية عرض هذا الإطار الموجود حول الصورة بيكسيل, فلو كنت مثلاً تريد عمل إطار حول الصورة بحجم 5بيكسيل تكتب هكذا:
والمثال التالي يوضح كيفية عمل إطار للصورة:
- قم بتشغيل برنامجnotepad واكتب به نص ملفhtmlكما في الشكل التالي:
- قم بحفظ المستند بامتدادhtml. وقم بفتح المستند في متصفح الإنترنت فيظهر الإطار حول الصورة بعرض 5بيكسيل, كما في الشكل التالي:
