الدرس الأول : أساسيات (BASICS) في html
تطرقنا في المقال السابق عن بعض المعلومات عن html وفي هذة الدروس سنغوص و إياكم في بحورها لنستخرج دررها المكنونة فلنستعد فالرحلة قد بدأت !!!!
الدرس الأول :
أساسيات (BASICS) في html
تكتب لغة الـhtml بين رموز غريبة تسمى
بالأنجليزية tags و تسمى باللغة العربية الوسوم
وتكون بالصيغة التالية
<tags> يكتب بينها كود الوسم</tags>
مثلا :
<p> هذا الوسم يكتب فقرة </p> , <hr> هذا الوسم لعمل خط أفقي</hr> , وهكذا
يسمى الجزء الأول <p> أو <hr> بالtag
.
ويسمى
الجزء الثاني </p> أو </hr> , بال Antitag .
فمثلا هذا الكود :
<html> </html> بينهما
تكتب كل الوثيقة و بدون هما لا يمكن للمتصفح أن يعرف أن هذا الكود بلغة html,
<head> </head> بينهما
تكتب كل المعلومات الخاص بالمستند(أي بيانات وصفية) كعنوان المستند مثلا, و
روابط إلى السكربتات الموجودة فيها و كذلك صفحات الأنماط بـCSS وغيرها.
<title> </title> بينهما يكتب عنوان صفحة الويب , لاحظ أنه بين الوسمين <head> و </head>
.
<body> </body> بينهما
يكتب محتوى الموقع ككل و الجزء الذي يظهر
للمتصفح في الواجهة و الجزء الذي تدور عليه أغلب
دروس في html , ولا يجوز أن يكون هناك أكثر من عنصر منه - body - في مستند الـhtml
.
مثال:لنذهب إلى المفكرة و
نكتب هذا الكود :
و
في الحفظ نختار
(save) أو حفظ (save as) اختر حفظ باسم , و تأكد من وضع الامتداد بهذة الصيغة name.html أو بـ name.htm
ستظهر لك صورة بهذا الشكل :
يعني أصبح الكود الذي كتبته في المفكرة و
حفظته بامتداد html. أصبح على هيئة صفحة ويب!!!!!
بعد الضغط عليها مرتين
أو بالضغط على يمين الفأرة ثم الضغط على فتح , تظهر لك الصورة التالية:
إذا ظهرت لك نفس النتيجة فمبارك عليك أول
صفحة ويب قد أنشأتها تهانينا.
ملاحظات سريعة :
1-
يجب حفظ الوثيقة بالامتداد .html أو .htm
2-
لا فرق في html بين الوسم <body> </body> بالحروف الصغيرة lowercase و الوسم<BODY> </BODY>
بالحروف الكبيرة UPERCASE,
أو بكليهما بمعنى أخر الـ html لا تتأثر بحالة الحروف .
3-
كل محتوى الموقع أو الصفحة يكتب بين الوسم <body> </body>.
4-
الوسم <title> </title> يكتب فيه عنوان الصفحة أو الموقع .
5-
وثيقة html تكوين بين الوسم<html> و بين الوسم </html> .
مشاهدة الفيديو اضغط هنا
في الأخير... فضلا و ليس أمرا إذا أعجبك المقال. فشاركه مع غيرك.
روزوا صفحتنا على الفيسبوك : MADI TECH ONE
تعليقات
إرسال تعليق