عالم التصميم والبرمجة عالم التصميم والبرمجة
random

آخر الأخبار

random
جاري التحميل ...

أساسيات لغة HTML | الدرس الرابع

بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته

خاصية bgcolor

لم تعد تستخدم كثيرا لأن لغة css لغة التنسيق أغنتنا عنها ، ولكن من أجل المعرفة فقط ، هي تأخذ كقيمة اللون الذي تريده كخلفية لكامل الصفحة ، أنظر الصورة:



تنسيق النصوص

نبدأ بالعلامة font وهي زوجية من النوع inline ، يمكننا بها التحكم في لون الخط ونوعه وحجمه ، وهي من العلامات المصنفة في html5 في لائحة التي سيتخلى عنها مستقبلا ، يمكن الإستغناء عنها بلغة css ، والمتصفحات إلى حد الآن لا تزال تدعمها في آخر إصداراتها، أنظر الصورة :


وكما ترى الفرق واضح بين العنوان المنسق والعنوان غير المنسق ، باستخدام العلامة font، والخاصية color لتغيير اللون ، والخاصية size لتغيير حجم الخط ، والخاصية face لتغيير نوع الخط.
وللتأثير أيضا على الخط تستخدم علامات زوجية من النوع inline مثل : u و i و b ، أنظر الصورة:


كما ترى العلامة u وضعت خط تحت النص ، والعلامة b جعلت الخط عريضا ، والعلامة i جعلته مائلا .
u إختصار للكلمة underline
b إختصار للكلمة bold
i إختصار للكلمة italic
ونختم هذا الباب بالعلامة span الزوجية من النوع inline ، وهي متعددة الإستعمالات ، منها أنها توضع داخل نص معين لاقتطاع كلمة أو جملة معينة لتنسيقها لاحقا بلغة css وإعطائها شكلا مختلفا عن بقية النص، أنظر الصورة:



تحويل عناصر إلى روابط

باستخدام العلامة الزوجية a التي رأيناها في الدروس الماضية يمكن تحويل عدة عناصر إلى روابط ، أنظر الصورة:



كما ترى تحول العنوان h2 إلى رابط ، وكذلك جزء من الفقرة p ، وأحطنا الصورة الأيقونة img بالعلامة a فتحولت إلى رابط بمسار موقع الفايسبوك.

القوائم

لإنشاء قائمة نستخدم العلامة الزوجية ul للحصول على قائمة غير مرتبة ، أو العلامة الزوجية ol للحصول على قائمة مرقمة ، ونضع داخلها العلامة الزوجية li وبداخلها نكتب المحتوى، أنظر الصورة:


وإذا أردنا عدة قوائم داخل قائمة واحدة مع ترويسات ، نستخدم العلامة الزوجية dl وداخلها العلامة الزوجية dt للترويسة والعلامة الزوجية dd للمحتوى ، أنظر الصورة :


نكتفي بهذا القدر ، وموعدنا في الدرس القادم إن شاء الله.
دمتم في رعاية الله.

عن الكاتب

Abdellah Yassine

التعليقات






اتصل بنا

إذا أعجبك محتوى مدونتنا نتمنى البقاء على تواصل دائم ، فقط قم بإدخال بريدك الإلكتروني للإشتراك في بريد المدونة السريع ليصلك جديد المدونة أولاً بأول ، كما يمكنك إرسال رساله بالضغط على الزر المجاور ...

جميع الحقوق محفوظة

عالم التصميم والبرمجة