blac mana
New member
باسم الله الرحمان الرحيم
السلام عليكم ورحمة الله تعالى وبركاته
ها أنا أعود لكم بالدرس الثاني في تعلم لغة البرمجة html ومعذرة عن التأخير
تكلمنا في الدرس السابق عن ماهية خصائص html وأخذنا مقدمة عنها
ويمكنكم زيارته من
هنا
واليوم بحول الله سوف نأخذ كيفية إنشاء أول صفحة html
افتح برنامج المفكرة بالwindows
ولنكتب التالي
ملاحظة, الرجاء التمعن في قراءة الكود جيدا, سوف أشرح الكود بعدها في الأسطر القادمة, لأي أسئلة إنشاء الله, سوف أجيب عنها في الردود.
والآن لنأخذ الكود بالتفصيل
بدأنا كتابة الصفحة ب <html>, وقد وضحت في الدرس السابق أن هذا الكود يقول للمتصفح, أو يشرح له أناه لغة html للتعامل معها, لو كانت php أوا java skript لكتبنا شيئ آخر, المهم لنعد إلى صلب الموضوع
<head>
نفتح به رأس الصفحة head, والذي يكتب فيه الكلمات الدلالية والوصف للموقع والعنوان, وسوف نتناولهم في دروس قادمة إنشاء الله
<title>موقعي الأول</title>
ال title وهو ما يعرف بالعنوان, نكتب أولا <title> وهو بداية الوسم بعدها نكتب النص, ثم نغلق ال وسم </title>,
للتوضيح فقط, ال / كما سأل عنها بعض الإخوة هي لتمييز نهاية الوسم عن آوله
</head> لنغلق وسم الرأس الذي بدأناه سابقا
<body>
نفتح به جسم الصفحة الذي يكتب فيه المحتوى: فقرات, رؤوس مواضيع, روابط, محتوى midia, إلى آخره
<h1> نفتح به وسم رأس موضوع وهو اختصار ل heading بال إنجليزية
ثم نكتب النص المطلوب, ثم نغلق الوسم ب </h1>
ملاحظة, الرقم الذي بعد ال h يبين مستوى من واحد إلى 6
يعني بهذا الشكل
وهكذا
ملاحظة أخيرة: يجب كتابة نفس الرقم في أول الوسم ونهايته
<p>
اختصار ل Paragraph وتعني فقرة, نكتب بالنص بين <p> و </p> لإغلاق الوسم
</body>
نغلق به وسم الجسم
</html>
لنقول للمتصفح أنهِي عملنا ب html
قبل أن تحفظ الملف, أود الإشارة أنه المتصفح لا يقرأ اللغة العربية بهذا الشكل بل يجب أنا نعمل التالي
1 اضف لل head الكود التالي بعد وسم ال title مباشرة
وهذا ليضيف ترميز ال UTF8
2 احفظ الملف ولاكن انتبه ان تختار من الصندوق هكذا الذي يأتي قبل ال save
Encoding: combo box UTF-8 collapsed Alt+e
نفس الطريقة هذه تتبعها إذا تريد عمل صفحة html
هناك وسوم أخرى يمكن أن تفيدنا مثل وسم الرابطو والذي سوف أعمل درس له ,شكله يأتي هكذا
<a href="Google">إذهب ل google</a>
وهناك ما يعرف بالوسوم المغلقة مثل:
<hr />
الذي يعمل خط فاصل بين النصوص أوا عناصر الصفحة
يرجى الاطلاع على الأمثلة التالية حتى تفهم كيفية عمل الكود
المثال الأول
المثال الثاني
هذا وما وفقني الله إليه, إنتظروني في الدرس القادم , وتحياتي للجميع
السلام عليكم ورحمة الله تعالى وبركاته
ها أنا أعود لكم بالدرس الثاني في تعلم لغة البرمجة html ومعذرة عن التأخير
تكلمنا في الدرس السابق عن ماهية خصائص html وأخذنا مقدمة عنها
ويمكنكم زيارته من
هنا
واليوم بحول الله سوف نأخذ كيفية إنشاء أول صفحة html
افتح برنامج المفكرة بالwindows
ولنكتب التالي
ملاحظة, الرجاء التمعن في قراءة الكود جيدا, سوف أشرح الكود بعدها في الأسطر القادمة, لأي أسئلة إنشاء الله, سوف أجيب عنها في الردود.
HTML:
<html>
<head>
<title>موقعي الأول</title>
</head>
<body>
<h1>رأس موضوع واحد</h1>
<p>مرحبا بك في موقعي</p>
</body>
</html>والآن لنأخذ الكود بالتفصيل
بدأنا كتابة الصفحة ب <html>, وقد وضحت في الدرس السابق أن هذا الكود يقول للمتصفح, أو يشرح له أناه لغة html للتعامل معها, لو كانت php أوا java skript لكتبنا شيئ آخر, المهم لنعد إلى صلب الموضوع
<head>
نفتح به رأس الصفحة head, والذي يكتب فيه الكلمات الدلالية والوصف للموقع والعنوان, وسوف نتناولهم في دروس قادمة إنشاء الله
<title>موقعي الأول</title>
ال title وهو ما يعرف بالعنوان, نكتب أولا <title> وهو بداية الوسم بعدها نكتب النص, ثم نغلق ال وسم </title>,
للتوضيح فقط, ال / كما سأل عنها بعض الإخوة هي لتمييز نهاية الوسم عن آوله
</head> لنغلق وسم الرأس الذي بدأناه سابقا
<body>
نفتح به جسم الصفحة الذي يكتب فيه المحتوى: فقرات, رؤوس مواضيع, روابط, محتوى midia, إلى آخره
<h1> نفتح به وسم رأس موضوع وهو اختصار ل heading بال إنجليزية
ثم نكتب النص المطلوب, ثم نغلق الوسم ب </h1>
ملاحظة, الرقم الذي بعد ال h يبين مستوى من واحد إلى 6
يعني بهذا الشكل
HTML:
<h1>heading1</h1>
<h2>heading2</h2>
<h3>heading3</h3>وهكذا
ملاحظة أخيرة: يجب كتابة نفس الرقم في أول الوسم ونهايته
<p>
اختصار ل Paragraph وتعني فقرة, نكتب بالنص بين <p> و </p> لإغلاق الوسم
</body>
نغلق به وسم الجسم
</html>
لنقول للمتصفح أنهِي عملنا ب html
قبل أن تحفظ الملف, أود الإشارة أنه المتصفح لا يقرأ اللغة العربية بهذا الشكل بل يجب أنا نعمل التالي
1 اضف لل head الكود التالي بعد وسم ال title مباشرة
HTML:
<meta charset="UTF-8">2 احفظ الملف ولاكن انتبه ان تختار من الصندوق هكذا الذي يأتي قبل ال save
Encoding: combo box UTF-8 collapsed Alt+e
نفس الطريقة هذه تتبعها إذا تريد عمل صفحة html
هناك وسوم أخرى يمكن أن تفيدنا مثل وسم الرابطو والذي سوف أعمل درس له ,شكله يأتي هكذا
<a href="Google">إذهب ل google</a>
وهناك ما يعرف بالوسوم المغلقة مثل:
<hr />
الذي يعمل خط فاصل بين النصوص أوا عناصر الصفحة
يرجى الاطلاع على الأمثلة التالية حتى تفهم كيفية عمل الكود
المثال الأول
المثال الثاني
هذا وما وفقني الله إليه, إنتظروني في الدرس القادم , وتحياتي للجميع
التعديل الأخير بواسطة المشرف:
