PHP කරා යමු - 17 (HTML)

දවල්ට කාලා පොඩි නින්දකුත් දාලා ඔන්න මම ආවා. කාලා ඉවර වෙලා පොඩි චිත්‍රපටියකුත් බලලා එහෙමයි නිදා ගත්තේ. වැහි කාලෙ නෙ. ඉතින් දන්නෙම නැතුව සැපටම නින්ද ගියා. දැන් නම් හොඳටම හවසුත් වෙලා. මගෙ හිතේ හවස හතට විතර ඇති. අපි ඔන්න ඉතින් ලින්ක් ගැනත් ඉගෙන ගත්තා එහෙනම්. එහෙනම් අපි මීලඟ පියවරට යමු. ඒ අපි Microsoft Word වල එහෙම දැකල තියෙන Bullets and Numbering කරන හැටි. ඒ කීවේ අංක හරි වෙනත් පුංචි සලකුණක් හරි දාලා ලයිස්තුවක් (list) හදන හැටි ඉගෙන ගන්න.

මේ සම්බන්ධව අපිට ඉගෙන ගන්න තියෙනවා ටැග් යුගල ජාති තුනක්. ඒ "<ol></ol>", "<ul></ul>" සහ "<li></li>" කියන යුගල ටැග් තුන් ජාතිය. අපි ඉලක්කම් දාලා ලයිස්තුවක් හදනවා නම් පාවිච්චි කරන්නේ ol (ordered list) කියන එක. ඒකේ තේරුම අපි පිළිවෙලකට ලියන ලයිස්තුවක් කියලා. නැත්නම් වෙනත් සලකුණක් දාලා ලයිස්තුවක් හදනවා නම් ගන්නේ ul (unordered list) කියන එක. ඒකේ තේරුම අපි පිළිවෙලකට නොලියන ලයිස්තුවක් කියලා. ලයිස්තුවක තියෙන අංග ලියන්න අපි පාවිච්චි කරන්නේ li (list item) කියන ටැග. අවසාන වශයෙන් අපි හදන ලයිස්තුවේ ලයිස්තු අයිතම ලියැවෙන්නේ මේ ටැග් යුගල අතරේයි. එහෙනම් මොකටද අර අනික් ටැග් ජාති දෙක? කෙලින්ම li පාවිච්චි කරන්න පුළුවන් නේ. එහෙම හිතන්න පුළුවන්. ඒත් අපි පාවිච්චි කරන්නේ ඉලක්කම් හෝ සලකුණක්ද කියන එක යොදා ගන්නයි ඒ ටැග් ජාති අපි යොදා ගන්නේ. අපි ලියන්නේ ඒ ටැග සුපුරුදු රීති ටික උපයෝගී කර ගෙන. ඒ එක ටැග් යුගලක් අතරේ අනික් ටැග් යුගලය ලියන ආකාරයට. ඒ මෙන්න මෙහෙම. මුලින්ම ඉලක්කම් දාපු ලයිස්තුවක් බලමු.
<ol>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ol>
පෙනෙන්නේ පහල තියෙන විදියට.

1. item 1
2. item 2
3. item 3

මීලඟට සලකුණු තියෙන ලයිස්තුවක් බලමු. ඒ,
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>
පෙනෙන්නේ පහල තියෙන විදියට.

• item 1
• item 2
• item 3

ol, ul වගේම li කියන ටැග් වලත් ඇට්‍රිබියුට් තියෙනවා. ඒව මෙන්න මෙහෙම පහලින් කියන්නම්.

ol වල start ඇට්‍රිබියුට් එක - අපේ ඉලක්කම් තියෙන ලයිස්තුවේ ඉලක්කම් පටන් ගන්නේ කොයි ඉලක්කමේ ඉඳලද කියලා පූර්ණ සංඛ්‍යාවක් අගය හැටියට දෙන එකයි මේකෙන් කරන්නේ.
<ol start="5" >
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ol>

5. item 1
6. item 2
7. item 3

ol ටැග ඇතුලේදී li වල value ඇට්‍රිබියුට් එක - අපිට ඕනෙ නම් පුළුවන් ලයිස්තුවේ ඕනෙම අංගයකට අපි දෙන ඉලක්කමක් මේකට දෙන අගයකින් පාලනය කරන්න, ol ටැගෙන් මොක දුන්නත්.
<ol start="10" >
<li value="20" >item 1</li>
<li>item 2</li>
<li value="40">item 3</li>
</ol>

20. item 1
21. item 2
40. item 3

ul වල type ඇට්‍රිබියුට් එක - අපි පාවිච්චි කරන්නේ කොයි විදියේ සලකුණක්ද කියලයි මේකෙන් කියවෙන්නේ. එක්කො කළු කරපු කොටුවක්ද (square) කළු කරපු රවුමක්ද(disc) නැත්තම් නිකන්ම රවුමක්ද (circle) කියලා.
<ul type="square">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>

• item 1
• item 2
• item 3

li වල type ඇට්‍රිබියුට් එක - අපි පාවිච්චි කරන්නේ ඉලක්කම්ද, සලකුණු ලයිස්තුවක්ද කියන එකේ සැලකීමක් නැතුව අංග වලට වෙනත් ඉලක්කම් වර්ග හරි සලකුණු වර්ග පාවිච්චි කරන්න පුළුවන් මේකට අගයක් දැම්මාම. ඒ අගයන් තමා "1, a, i, circle, square, disc"
<ol>
<li type="a">item 1</li>
<li>item 2</li>
<li type="i" >item 3</li>
<li>item 4</li>
<li type="circle" >item 5</li>
</ol>

1. item 1
2. item 2
3. item 3
4. item 4
5. item 5

අපිට අයිතමයක් නැත්තම් අංගයක් යටතේ තවත් ලයිස්තුවක් ලියන්න ඕනෙ නම් මෙන්න මේ විදියටයි ලියා ගන්නේ.

<ol>
<li>item1</li>
<ol>
<li>sub item1</li>
<li>sub item2</li>
</ol>

<li>item2</li>

<li>item3</li>
<ul>
<li>sub item1</li>
<li>sub item2</li>
</ul>

</ol>

ඒ කියන්නේ li ටැග් යුගලක් ලීවට පස්සේ, මීලඟ li ටැග් යුගලෙ ලියන්න කලින් හරි, ප්‍රධාන ටැගය (ol හරි ul හරි) වහන්න කලින් හරි ආයෙත් ප්‍රධාන ටැග් වර්ගෙන් එකක් ආරම්භ කරලා සුපුරුදු විදියට ලයිස්තුවක් ලියා ගන්නවා. ඒ ලයිස්තුව අවසන් කරලා, වහලා තමා ආයෙත් මුල් ලයිස්තුව ඉදිරියට ලියන්නේ හෝ අවසන් කරන්නේ. ලීවම පේන්නේ පහල තියෙනවා වගේ.

1. item1
1. sub item1
2. sub item2
2. item2
3. item3
• sub item1
• sub item2