wesamdev

افلام هندية$type=sticky$count=4$show=home

$show=home

|روبوتات_$type=slider$source=random-posts$snippet=hide$cate=20$show=home

|اضافات بلوجر$type=three$m=0$rm=0$h=400$c=3$show=home

$show=home

wesamdev

عناصر HTML | بالعربي

لا تتطلب كل العناصر وجود وسم النهاية/محتوى ، حيث لا تحتوي بعض عناصر HTML على [محتوى و وسم النهاية]،

عناصر HTML | بالعربي

عناصر HTML | بالعربية


كل شئ فى لغة HTML عبارة عن عنصر element، حيث يتكون عنصر HTML غالبًا من 3 أجزاء:

  1. وسم البدء (Start tag)
  2. وضع المحتوى (سواء كان نص/رابط/صورة/ …إلخ).
  3. وسم النهاية (End tag).

 


 

العناصر – HTML Elements

 

تتم كتابة معظم عناصر لغة HTML بوسم البداية (<h1>) ووسم النهاية (<h1/>)، مع إدراج المحتوى بينهما. وإذا لاحظت فى الرسمة السابقة ستجد أن وسم HTML يتكون من اسم العنصر (متشابهه فى كلًا من وسم البداية والنهاية) وتحيط به أقواس زاوية، ولكن يحتوي وسم النهاية فقط على شرطة مائلة بعد قوس زاوية الفتح (لتمييزها عن علامة البداية).

 

مثال للتوضيح (بعض عناصر لغة HTML):
    <h1>My main Heading</h1>
<p>This is Paragraph.</p>
<span>This is Span.</span>
    

مخرجات الكود السابق


  

My main Heading

This is Paragraph.

This is Span.

 

العناصر الفارغة – Empty Elements

 

لا تتطلب كل العناصر وجود وسم النهاية/محتوى ، حيث لا تحتوي بعض عناصر HTML على [محتوى و وسم النهاية]، مثل عنصر <hr> (يٌستخدم لإدراك خط أفقى).

تسمى هذه العناصر بالعناصر الفارغة (أى ليس لها وسم نهاية)، ولا يمكن أن تحتوي على أي محتوى أو عناصر أخرى. 

 

مثال للتوضيح (إدراك خط أفقى بين العنوان <h1> والفقرة <p>):

My main Heading

This is Paragraph.


العناصر الفارغة 

  1. <b> يحدد فاصل أسطر.
  2. <hr>يحدد خط افقي في المحتوي لفصل الاقسام في HTML.

يمكن أن تكون العناصر الفارغة “مغلقة” في علامة الفتح (</ hr>).

العناصر المتداخلة – Nested HTML Elements

 

عناصر HTML المتداخلة (وضع عنصر داخل عنصر آخر)؛ يمكن أن تحتوي معظم عناصر HTML على أي عدد من العناصر داخل بعض (باستثناء العناصر الفارغة). تتكون جميع ملفات HTML من عناصر متداخلة.

يمكن أن يكون العنصر المتداخل (أو العنصر الفرعي)، عنصرًا أصليًا أيضًا إذا تم تضمين عناصر أخرى فيه.

مثال للتوضيح (بعض العناصر المتداخلة):

 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>HTML Elements</title>
  </head>
  <body>

    <h1>HTML</h1>
    <p>We Use <b>HTML</b> Language For Built Websites.</p>

  </body>
</html>

 

مخرجات الكود السابق


    

HTML

We Use HTML Language For Built Websites.


شرح المثال السابق:

 

  1. يحدد إعلان <DOCTYPE!> معلومات عن نوع مستند HTML.
  2. العنصر <html> يحدد الملف بالكامل (هو حاوية لجميع عناصر HTML ولكل ما يظهر في مستند HTML، باستثناء إعلان الـ <DOCTYPE!>).
  3. كما يوجد داخل العنصر <html> عنصرين هم: <head> و <body>.
  4. يحدد العنصر <head> رأس المستند (هو حاوية للبيانات الوصفية ويتم وضعه بعد فتحة وسم الـ <html> وقبل فتحة وسم الـ <body>).
  5. داخل عنصر <head> عنصرين آخرين هم: <title>(يحدد عنوان المستند الذى يظهر فى علامة التبويب)، و <meta> (يحدد البيانات الوصفية لمستند HTML).
  6. يحدد العنصر <body> جسم أو المحتوى الرئيسي لمستند HTML.
  7. ستجد داخل عنصر الـ <body> عنصرين آخرين هم: < h1> (يحدد عنوان رئيسي) و <p> (يحدد فقرة).

لا تنسى إغلاق الوسم (End Tag): إذا نسيت قفلة الوسم الخاص بالعنصر الكود هيشتغل عادى، لكن هيدرك مشاكل فيما بعد، فكُن حَزر ولا تنسي إغلاق الوسم.

 

 

وسوم لغة HTML ليست حساسة لحالة الأحرف Case Sensitive (أى الوسم <H1> == <h1> ). لكن منظمة الـ W3C توصى بالأحرف الصغيرة.

wesam developer

إذا أعجبك المقال أو كان مفيدًا - ضع "أعجبني". اشترك في المدونة اوشارك برأيك في التعليقات! أراك لاحقا

COMMENTS

BLOGGER
الاسم

اخبار,45,اداة للكمبيوتر,7,اضافات بلوجر,88,افلام اجنبي,9,افلام روسية,32,افلام عربي مترجمة الي الروسية,1,افلام قديمة,2,افلام هندي,8,البرمجة,8,الجديد في التكنولوجيا,46,العاب,9,النمر,7,اليوتيوب,16,اندرويد,15,اندرويد استوديو,3,برامج كمبيوتر,11,بلوجر,8,تركيا,6,تصميم,3,تطبيقات,20,جافاسكريبت,3,حوادث,5,حول العالم,65,حيوانات,25,خلفيات,1,دروس HTML| بالعربية,2,روبوتات,8,روسيا,60,سياحة,4,سيارات,12,سياسة,16,شروحات,34,شريط الاخبار,1,صحتي,2,طائرات,22,فن,35,قناة الوعي نور,4,قناة قعدة تاريخ,8,قوالب بلوجر,3,كتب الكترونية,7,مالتي ميديا,6,متصفح,2,محليات,4,مسلسل لعبة الحبار,1,مسلسلات اجنبية,2,مسلسلات رمضان 2022,1,مسلسلات رمضان 2120,1,مصر والعرب,1,معدات حربية,34,معدات زراعية,6,مقالات,99,مواصلات النقل,1,مواقع للتصميم,14,وثائقي,14,وسوم بلوجر,2,ويندوز,15,Antivirus,3,Button,1,c++,1,css,37,HTML,11,wesam,2,
rtl
item
Wesam: عناصر HTML | بالعربي
عناصر HTML | بالعربي
لا تتطلب كل العناصر وجود وسم النهاية/محتوى ، حيث لا تحتوي بعض عناصر HTML على [محتوى و وسم النهاية]،
https://1.bp.blogspot.com/-OLABbejYLPE/YLUvpqkihqI/AAAAAAAAVGY/AVi3PIJXxl4flHyRGV8YKPITjzUgCnQugCLcBGAsYHQ/s16000/html-1695519_1280.jpg
https://1.bp.blogspot.com/-OLABbejYLPE/YLUvpqkihqI/AAAAAAAAVGY/AVi3PIJXxl4flHyRGV8YKPITjzUgCnQugCLcBGAsYHQ/s72-c/html-1695519_1280.jpg
Wesam
https://www.wesamdev.com/2021/05/html_31.html
https://www.wesamdev.com/
https://www.wesamdev.com/
https://www.wesamdev.com/2021/05/html_31.html
true
1297279864306511161
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy Table of Content