تم إنشاء c4a.dev لمساعدتك على التركيز أثناء مُشاهدة الكورسات والإبتعاد عن إزعاج اليوتيوب
كيفية الشراء من الموقع

منطقة إعلانية

يُمكننا وضع إعلانك هنا 🧡 ويُمكنك التواصل معنا عن طريق صفحة الفيس بوك

سعر الإعلان 3$ فى اليوم الواحد

شرح HTML lists tags

الوسوم الخاصة ب عمل القوائم Html lists tags والتي تُمكننا من عمل القوائم سواء قوائم مُرتبه او غير مُرتبه.

1

html ul tag

<ul> </ul>
<li> </li>

Ul اختصار ل unordered list ومعناها قائمة غير مُرتبة.
وتُستخدم عندما يكون لدينا قائمة من الأشياء. وكل شيء يكون داخل عنصر ال <li>
عنصر ال <li> دائما يكون داخل عنصر ال <ul>
مثال على ذلك:

 
<ul>
  <li>Python</li>
  <li>Javascript</li>
  <li>PHP</li>
</ul> 

2

html li tag

<li> </li>

Li هي اختصار ل list item ومعناها قائمة أشياء.
ودائما هذا العنصر يكون داخل عنصر ال <ul> <ol>

3

html ol tag

<ol> </ol>

Ol : هي اختصار ل ordered list ومعناها قائمة مرتبة.
وتُستخدم عندما يكون لدينا قائمة مُرتبة من العناصر. وسيتم ترتيب هذه العناصر ابتداء من رقم 1. وكل عُنصر يكون داخل وسم ال <li>
ويُمكن ان يحتوي على اثنان attribute هم:

  • start :وهو الرقم الذى سوف يبدأ منه ترقيم العناصر وتُستخدم مع الأرقام فقط
  • type :وهو نوع الترقيم سواء أبجدي او ارقام او أرقام رومانية
    • 1
    • A
    • a
    • I
    • i
مثال على ذلك:
 
<ol  type="1" start="0">
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ol>   
4

html dl tag

<dl> </dl>
<dt> </dt>
<dd> </dd>

dl: هي اختصار ل description list ومعناها قائمة وصفية.
وهذه العناصر الثلاثة تُستخدم معا عندما يكون لدينا قائمة من العناصر نُريد وصفها.
مثال على ذلك إذا كان لدينا عنصرين هما html و CSS ونريد تعريفهم او وصفهم:

أولا : نستخدم وسم ال dt وهو اختصار ل definition title ويكون محتواه هو ال html او CSS
ثانيا : نستخدم وسم ال dd وهو اختصار ل definition description ويكون مُحتواه عبارة عن التعريف الخاص بالعنصر داخل وسم ال dt
مثال على ذلك:

 
<dl>
  <dt>HTML</dt>
  <dd>HTML is the standard markup language for Web pages.</dd>
  <dd>With HTML you can create your own Website.</dd>
 
  <dt>CSS</dt>
  <dd>CSS is a language that describes the style of an HTML document.</dd>
  <dd>CSS describes how HTML elements should be displayed.</dd>
</dl> 

المصادر

w3schools.com

  1. w3schools.com ul tag
  2. w3schools.com li tag
  3. w3schools.com ol tag
  4. w3schools.com dl tag
  5. w3schools.com dt tag
  6. w3schools.com dd tag

w3.org

  1. w3.org ul tag
  2. w3.org li tag
  3. w3.org ol tag
  4. w3.org dl tag
  5. w3.org dt tag
  6. w3.org dd tag
😡
انت مشغل الـ AdBlock !!

خلى بالك يامعلم ✋ انا هكر جامد جداً وعرفت انك مشغل ال AdBlock ف ياريت تقفله بدل ما اولع فى ام الجهاز بتاعك ده 😡 😡