اساسيات HTML

لا تقلق إذا استخدمت الأمثلة فى الدروس السابقة ولم تفهمها.
سوف تتعلم عنهم في الفصول القادمة. فى هذا الدرس ( اساسيات HTML ) عليك تطبيق كل مثال لكى تتمكن من ان تفهمه

اساسيات HTML

يجب أن تبدأ جميع HTML بهذا التاج: <! DOCTYPE html>.
يبدأ HTML نفسه بـتاج <html> وينتهي بـتاج </ html>.
الجزء المرئي من HTML يكون بين <body> و </ body>.
مثال:
<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

ملخص اساسيات HTML

ال HTML مثل ما تكلمنا فى الدروس السابقة هو لغة معتمده على الاوامر فعليك حفظ الاوامر التالية ومعرفه ماذا تفعل اى تجرب كل كود فى محرر ال HTML لكى تستطيع استخدمها حين تريد ذلك. يمكنك ان ترجع الى الدرس السابق و تتعلم تنصيب محرر لتعليم html ومن ثمه تكمل هذا الدرس.

عناوين HTML

( او ما تعرف ب HTML Headings )
يتم تعريف عناوين HTML بالتاجز من <h1> إلى <h6>.
<h1> يحدد العنوان الأكثر أهمية. <h6> يحدد العنوان الأقل أهمية:
مثال:
<h1>هذا عنوان مهم جدا</h1>
<h2>هذا عنوان متوسط الاهميه</h2>
<h3>هذا عنوان اقل اهميه</h3>

فقرات HTML

( او ما تعرف ب HTML Paragraphs )
يتم تعريف الفقرات HTML بتاج<p>:
مثال:
<p>هذا مقال</p>
<p>هذا مقال اخر</p>

روابط HTML

( او ما تعرف ب HTML Paragraphs )
يتم تحديد روابط HTML باستخدام تاج<a>:
مثال:


<a href="https://www.T3lemOnline.com">T3lemOnline Link</a>



يتم تحديد الرابط المراد الذهاب اليه عن طريق Href سمة
يتم استخدام السمات لتوفير معلومات إضافية حول عناصر HTML.
سوف تتعلم المزيد عن السمات في فصل لاحق.




صور HTML

( او ما تعرف ب HTML Images)
يتم تعريف صور HTML باستخدام العلامة <img>.
يتم التعرف على مصدر الملف من خلال (src) ويتم التعرف على النص البديل (alt) و اما بخصوص الطول و العرض عن طريق width و height كل هذا عباره عن سمات
مثال:


<img src="T3lemOnline.jpg" alt="T3lemOnline.com" width="102" height="140">



أزرار HTML

( او ما تعرف ب HTML button)
يتم تعريف أزرار HTML باستخدام العلامة <button>
مثال:



<button>اضغط هنا</button>


قوائم HTML

( او ما تعرف ب HTML Lists)
يتم تعريف قوائم HTML مع <ul> (قائمة unordered/bullet ) أو علامة <ol> (قائمة مرتبة / رقمية) ، متبوعة بتاج <li> (عناصر القائمة)
مثال:


<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>



0 التعليقات

إرسال تعليق