وانەی 24 لە 67

وانەی ٢٤: لیستی ڕیزکراو: ol

فایلی دەستپێک: lesson-24-start.html
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
  <head>
    <meta charset="UTF-8">
    <title>چۆن چا دروست بکەین</title>
  </head>
  <body>
    <h1>چۆن چا دروست بکەین</h1>
    <ul>
      <li>ئاوەکە بکوڵێنە.</li>
      <li>چاکە بخە ناو قوریەکە.</li>
      <li>ئاوی گەرمەکەی تێ بکە.</li>
      <li>سێ خولەک بوەستە.</li>
      <li>چاکە بکە ناو پیالەکان.</li>
    </ul>
  </body>
</html>
ناوەڕۆکی ئەم وانەیە بەشی ١: کاتێک ڕیزبەندی بەشی ٢: ژمارەکان خۆکارن بەشی ٣: کام لیست بەکاربهێنم؟

بەشی ١: کاتێک ڕیزبەندی

فایلی دەستپێک بکەرەوە. لەم لاپەڕەیەدا هەنگاوەکانی دروستکردنی چامان نووسیوە. ئەم هەنگاوانە دەبێت بە ڕیز ئەنجام بدرێن؛ بۆ نموونە، سەرەتا ئاوەکە دەکوڵێنین، پاشان دەیڕێژینە ناو قوریەکە.

بەڵام ئێستا هەنگاوەکانمان لەناو <ul> داناوە. بۆ پیشاندانی لیستێک کە ڕیزبەندیی بەندەکانی گرنگە، توخمی <ol> بەکاردەهێنین. «ol» کورتکراوەی ordered listـە، واتە لیستی ڕیزکراو.

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

نموونە

html
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
  <head>
    <meta charset="UTF-8">
    <title>چۆن چا دروست بکەین</title>
  </head>
  <body>
    <h1>چۆن چا دروست بکەین</h1>
    <ol>
      <li>ئاوەکە بکوڵێنە.</li>
      <li>چاکە بخە ناو قوریەکە.</li>
      <li>ئاوی گەرمەکەی تێ بکە.</li>
      <li>سێ خولەک بوەستە.</li>
      <li>چاکە بکە ناو پیالەکان.</li>
    </ol>
  </body>
</html>
خۆت تاقی بکەرەوە ↗

ئەنجام

بەشی ٢: ژمارەکان خۆکارن

هیچ ژمارەیەکمان نەنووسی. وێبگەڕ بەندەکانمان بۆ دەژمێرێت. توخمەکانی <li> هەر وەک خۆیان دەمێننەوە.

با ببینین بۆچی ئەمە سوودبەخشە. هەنگاوێکی نوێ دوای  یەکەم هەنگاو زیاد بکە:
<li>قوریەکە گەرم بکە.</li>

سەرنج بدە، هەنگاوە نوێیەکە وەک ژمارە ٢ دەردەکەوێت، و هەنگاوەکانی تر یەک ژمارە دەچنە خوارەوە.

ئەگەر ژمارەکانمان بە دەست بنووسیایە، دەبوو هەموویان بگۆڕین.

بەشی ٣: کام لیست بەکاربهێنم؟

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

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

پوختە
  • <ol> بۆ لیستێکە کە ڕیزبەندیی بەندەکانی گرنگە.
  • لە هەردوو جۆری لیستدا، واتە <ul> و <ol>، هەر بەندێک بە <li> دەنووسین.
  • وێبگەڕ ژمارەکان خۆکارانە زیاد دەکات. بە زیادکردن یان لابردنی بەندێک، ژمارەکانیش نوێ دەبنەوە.
  • کاتێک گۆڕینی ڕیزبەندی مانا یان ئەنجامەکە دەگۆڕێت، <ol> بەکاربهێنە.
ڕاهێنان
١. سێ هەنگاو بۆ دروستکردنی خواردنێکی سووک لەناو <ol> بنووسە.
٢. هەنگاوێکی نوێ لە ناوەڕاستی لیستەکەدا زیاد بکە. پاشەکەوتی بکە و لاپەڕەکە نوێ بکەرەوە، پاشان سەیری ژمارەکان بکە.
٣. <ol> و </ol> بگۆڕە بۆ <ul> و </ul>. جیاوازییەکە ببینە، پاشان بیانگەڕێنەرەوە.

نموونە

html
<!DOCTYPE html>
<html lang="ckb" dir="rtl">
  <head>
    <meta charset="UTF-8">
    <title>چۆن چا دروست بکەین</title>
  </head>
<body>
  <h1>چۆن چا دروست بکەین</h1>
  <ol>
    <li>ئاوەکە بکوڵێنە.</li>
    <li>قوریەکە گەرم بکە.</li>
    <li>چاکە بخە ناو قوریەکە.</li>
    <li>ئاوی گەرمەکەی تێ بکە.</li>
    <li>سێ خولەک بوەستە.</li>
    <li>چاکە بکە ناو پیالەکان.</li>
  </ol>
</body>
</html>
خۆت تاقی بکەرەوە ↗

ئەنجام

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