بسم الله الرحمن الرحيم
لغة ترميز النص الفائق (Hyper Text Markup Langauge) واختصارها HTML من أقدم اللغات وأوسعها استخداما في تصميم صفحات الويب .
وتستخدم الـ HTML مايعرف بالوسوم Tags لإصدار التعليمات إلى المتصفح، هذه الوسوم توضع بين علامتى أكبر من > وأصغر من < التي تنقسم إلى نوعين :
- وسوم البداية كـ <html> , <p> , <h1> , <body> .
- وسوم النهاية كـ <html> , </p> , </h1> , </body/> .
- الوسم <HTML> لبداية الصفحة و الوسم </HTML> لنهاية الصفحة .
- الوسم <HEAD> <HEAD/> لبداية المقطع الذي فيه معلومات تعريف الصفحة كالعنوان .
- الوسم </TITLE> <TITLE> وهو لعنوان الصفحة .
الأن لنقم بكتابة اول صفحة ويب باستخدام الوسوم السابقة ونقم بترتيبها من اول الصفحة الى اخرها :
لغة ترميز النص الفائق (Hyper Text Markup Langauge) واختصارها HTML من أقدم اللغات وأوسعها استخداما في تصميم صفحات الويب .
وتستخدم الـ HTML مايعرف بالوسوم Tags لإصدار التعليمات إلى المتصفح، هذه الوسوم توضع بين علامتى أكبر من > وأصغر من < التي تنقسم إلى نوعين :
- وسوم البداية كـ <html> , <p> , <h1> , <body> .
- وسوم النهاية كـ <html> , </p> , </h1> , </body/> .
- الوسم <HTML> لبداية الصفحة و الوسم </HTML> لنهاية الصفحة .
- الوسم <HEAD> <HEAD/> لبداية المقطع الذي فيه معلومات تعريف الصفحة كالعنوان .
- الوسم </TITLE> <TITLE> وهو لعنوان الصفحة .
- الوسم <BODY> <BODY/> وهو لإدراج نصوص وصور وجداول .. الصفحة .
ملاحظة : اثناء شرح الدروس يمكنك كتابة الاكواد في محرر Notepad الموجود في ويندوز وبعد ذلك حفظه بامتداد htm وفتحه بأي متصفح مثل فايرفوكس او جوجل كروم لتجريب الكود .
الأن لنقم بكتابة اول صفحة ويب باستخدام الوسوم السابقة ونقم بترتيبها من اول الصفحة الى اخرها :
<html>
<body>
<h1>my name is khaled</h1>
<p>my name is khaled</p>
</body>
</html>
وكما قلنا نحفظه بمستند نصي بامتداد htm وثم نقوم بفتحه بالمتصفح وسيكون على الشكل التالي :
نلاحظ في الصفحة أن الوسوم لم تظهر فيها أبداً, وكل ما ظهر هو ما بين الوسوم ونلاحظ أن الجملة الأولى جاءت اكبر من الجملة الثانية حيث أن :
<p/> <p> و تستعمل لانشاء فقرة في الصفحة ووضعها في سطر خاص .
<h1/> <h1> هذا الوسم كلما زاد الرقم فيه قل حجم الخط, مثال عليه :
<p/> <p> و تستعمل لانشاء فقرة في الصفحة ووضعها في سطر خاص .
<h1/> <h1> هذا الوسم كلما زاد الرقم فيه قل حجم الخط, مثال عليه :
<h1>my name is khaled 1</h1>
<h2>my name is khaled 2</h2>
<h3>my name is khaled 3</h3>
- الوسم </b> سطر جديد .
- الوسم </b> سطر جديد .
- الوسم <hr/> رسم خط أو سطر في الصفحة .
my name is </br> khaled
<hr/>
my name </br> is khaled
- الوسم <ul><li> </ul></li> كتابة نص ذات تعداد نقطي .
- الوسم <ol><li> </ol></li> كتابة نص ذات تعداد رقمي .
<ul><li> my name is khaled </ul></li>
<ol><li> my name is khaled </ol></li>
كان هذا شرح بسيط للمبتدئين ابتعدنا فيه عن التعقيد والشرح الطويل لكيفية انشاء صفحة ويب وفي دروس قادمة سنشرح كيفية وضع روابط وصور وتعديل حجم ولون النصوص ...
اذا اعجبك الدرس يمكن ببساطة حفظه على جهازك من متصفح جوجل كروم بالضغط
على ctrl+p وسيتم حفظه على جهازك بصيغة pdf .
0 comments:
إرسال تعليق