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

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

شرح 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>