وانەی 25 لە 67

وانەی ٢٥: لیستی لەناو لیست (Nested)

ناوەڕۆکی ئەم وانەیە

بەشی ٢: لیستی ناوەوە لە کوێ دابنێین؟ بەشی ٣: گروپێکی تر زیاد بکە

هەندێک جار دەمانەوێت لەژێر بەندێکی لیستدا، لیستێکی بچووکتر پیشان بدەین. بۆ نموونە، لە مێنیوەکەماندا «چای ڕەش» هەیە، و دەمانەوێت دوو جۆری ئەو چایە پیشان بدەین: سیلان و ئاسام.

بۆ ئەوە، لیستێکی نوێ لەناو <li>ـی «چای ڕەش» دادەنێین. ئەمە پێی دەگوترێت لیستێک لەناو لیستێکدا (Nested list).

بەندی یەکەم بەم شێوەیە بگۆڕە:

<li>چای ڕەش
  <ul>
    <li>سیلان</li>
    <li>ئاسام</li>
  </ul>
</li>

سەرنج بدە کە سیلان و ئاسام لەژێر «چای ڕەش» دەردەکەون، بە کەمێک دووری لە کەناری لیستی دەرەوە. وێبگەڕ زۆرجار خاڵەکانی لیستی ناوەوەش بە شێوەیەکی جیاواز پیشان دەدات.

بەشی ٢: لیستی ناوەوە لە کوێ دابنێین؟

سەیری شوێنی <ul>ـی ناوەوە بکە. لەناو <li>ـی «چای ڕەش»دایە. واتە لیستە بچووکەکە تەواو دەکەین، پاشان بە </li> بەندی «چای ڕەش» دادەخەین.

بەم شێوەیە، پێکهاتەی HTMLـەکە پیشان دەدات کە سیلان و ئاسام سەر بە «چای ڕەش»ن. لیستە بچووکەکە لەنێوان دوو بەندی لیستی دەرەوە دانانێین.

تێبینی: بۆشاییەکانی سەرەتای دێڕەکان یارمەتیمان دەدەن ببینین کام توخم لەناو کام توخمە. بەڵام تاگەکان ئەم پێکهاتەیە دروست دەکەن، نەک بۆشاییەکان.

بەشی ٣: گروپێکی تر زیاد بکە

ئێستا با دوو جۆری چای سەوزیش زیاد بکەین. ئەم جارە لیستە بچووکەکە لەناو <li>ـی «چای سەوز» دادەنێین:

<li>چای سەوز
  <ul>
    <li>سێنچا</li>
    <li>یاسمین</li>
  </ul>
</li>

سەرنج بدە کە ئێستا هەر جۆرە چا لیستی تایبەت بە خۆی هەیە.

لیستی ناوەوە دەتوانێت <ul> یان <ol> بێت. پێویست ناکات هەمان جۆری لیستی دەرەوە بێت. وەک وانەی پێشوو، بەپێی ئەوە هەڵیدەبژێرین کە ڕیزبەندیی بەندەکان گرنگە یان نا.

هەڵەیەکی باو: لیستی ناوەوە دوای </li>ـی بەندە پەیوەندیدارەکە دابنێیت. لەوانەیە لە وێبگەڕدا هاوشێوە دەربکەوێت، بەڵام پێکهاتەکە هەڵەیە. لیستی ناوەوە لەناو هەمان <li> دابنێ، بۆ ئەوەی پەیوەندییەکە لە HTMLـەکەدا ڕوون بێت.

پوختە

بۆ پیشاندانی بەندە لاوەکییەکان، لیستێک لەناو بەندێکی لیستی تر دادەنێین.
لیستی ناوەوە لەناو <li>ـی بەندە پەیوەندیدارەکە دابنێ، پێش تاگی کۆتایی </li>.
لیستی ناوەوە دەتوانێت <ul> یان <ol> بێت، بەپێی گرنگیی ڕیزبەندی.
بۆشاییەکانی سەرەتای دێڕەکان خوێندنەوەی کۆد ئاسان دەکەن؛ تاگەکان پێکهاتەکە دیاری دەکەن.

ڕاهێنان

١. بەندی «چای گیایی» بۆ لیستی سەرەکی زیاد بکە. لەناو <li>ـەکەیدا، لیستێک دابنێ بۆ دوو جۆری چای گیایی.

٢. پشکنەر بکەرەوە و دڵنیابەرەوە کە هەر لیستێکی ناوەوە لەناو <li>ـی بەندە پەیوەندیدارەکەدایە.

٣. لیستی ناوەوەی «چای سەوز» لە <ul> بگۆڕە بۆ <ol>. هەردوو تاگی دەستپێک و کۆتایی بگۆڕە، پاشان سەیری ئەنجامەکە بکە.

نموونە

html

<!DOCTYPE html>
<html lang="ckb" dir="rtl">
  <head>
    <meta charset="UTF-8">
    <title>مێنیوی چا</title>
  </head>
<body>
  <h1>مێنیوی چا</h1>
  <ul>
    <li>چای ڕەش
      <ul>
        <li>سیلان</li>
        <li>ئاسام</li>
      </ul>
    </li>
    <li>چای سەوز
      <ul>
        <li>أحمد</li>
        <li>یاسمین</li>
      </ul>
    </li>
  </ul>
</body>
</html>

خۆت تاقی بکەرەوە ↗

دەستکاری HTML بکە

ئەنجام

چوونەژوورەوە بۆ پاشەکەوتکردنی پێشکەوتنت لە فێربووندا.