HTML Elements and tag
-
في هذا الدرس بنعرف شو يعني tag بالإضافة الى معني element مع تطبيق امثلة عملية عليهم.
tags
هي كلمات معرفه مسبقا في اللغة تستخدم لأغراض معينه مثل :
<h1> Welcome </h1>
حيث يعتبر <h1> عبارة عن tag ، واكيد كل tag لازم يكون له بداية ونهاية ،البداية بتكون باسم tag والنهاية بتكون بنفس الاسم مع إضافة العلامة (/) .
في بعض الtags المعدود ما بكون لها نهاية تكتب فقط بالاسم مثل <hr> و <br>
Elements
Element هو كل شيء بداية من tag ثم المحتوي ثم نهاية tag
الامر التالي كامل يعتبر element
<tagname>Welcome</tagname>
Empty elements
هي عبارة عن element لا يوجد بها محتوي مثل <br> ويستخدم لإضافة سطر فارغ ، أيضا <hr> ويستخدم لإضافة سطر افقي
Elements في HTML متداخله يعني ممكن أي element يحتوي element ثانية وكثيرة.
نشوف المثال التالي :
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body><h1>مرحبا بكم</h1><p>فريق ديفكوم يرحب بكم</p></body>
</html>
مثل ما بتلاحظ اول element باسم <html> ويحتوي عدد من elements مثل
<head> والذي يحتوي أيضا على element باسم <title>
<body> والذي يحتوي أيضا على element باسم <h1> و <p>
وهكذا يمكن ان تداخل elements داخل بعض.
تمام نتعرف على مجموعة امثلة ل elements و tag
تعرفنا لحد الان على ال tag المسمى <h1> ويعرف باسم HTML Headings
يدعم HTML هذا tag من <h1> الى <h6> ويعتبر <h1> اكبر حجم فيهم و <h6> اصغر حجم
مثال
<!DOCTYPE html>
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
HTML Paragraphsهذا tag مخصص لتتعامل مع الفقرات<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body><h1>مرحبا بكم</h1><p>فريق ديفكوم يرحب بكم</p></body>
</html>
HTML Links
يستخدم هذا tag لربط الصفحات ويكتب بالشكل
<a href="https://devkum.com">devkum</a>
مثال
<!DOCTYPE html>
<html>
<head>
<title>My First HTML Page</title>
</head>
<body><h1>مرحبا بكم</h1><p>فريق ديفكوم يرحب بكم</p><a href="https://devkum.com">devkum</a>
</body>
</html>
حيث يستخدم href attribute لتحديد الرابط المطلوب.
HTML Images
يستخدم هذا tag للتعامل مع الصور ويكتب بالشكل
<img src="one.jpg" alt="one" width="104" height="142">
عرض HTML Source
يمكن من خلال المتصفح عرض source للكود الخاص بصفحة HTML وذلك بالنقر يمين في صفحة HTML ثم بعدها اختر View Page Source
/
شكل الصفحة مع source
اترك تعليقك