List မွာ order list,unorder list နဲ႔ defination list ဆိုပီး႐ွိပါတယ္။
Order list ဆိုတာ နံပါတ္စဥ္ပါတဲ့ list ျဖစ္ပီးေတာ့ unoder list ကေတာ့နံပါတ္စဥ္မပါပါပူး။Defination list ကေတာ့လူသံုးနည္းပါတယ္။
UnorderList အတြက္သံုးတဲ့ Tag ေတြကေတာ့
< ul > < /ul > နဲ႔
< li > < /li > တို႔ပဲဖစ္ပါတယ္။
ေအာက္က နမူနာ code ေတြကို
ၾကည့္လိုက္ပါ။
< html >
< head >
< title > Unoder List < /title >
< /head >
< body >
< u > Unorder List < /u >
< ul >
<li>First</li>
<li>Second</li>
<li>Third</li>
< /ul >
< /body >
< /html >
< ul > < /ul > ၾကားမွာlist လုပ္ခ်င္တဲ့စရင္းအကုန္လံုးကိုေရးရပီးေတာ့
< li > < /li > ၾကားမွာေတာ့
List လုပ္မဲ့ဟာ ကိုေရးရမွာပါ။
Output ပံုေလးကိုၾကည့္ရင္ေတာ့႐ွင္းသြားမွာပါ။
အခုဆိုရင္ First,Second, Third ဆိုတဲ့စာေတြကို အဝိုင္းပံုေလးေတြနဲ႔ List လုပ္ထားတာေတြ႕ရမွာပါ။အဲ့အဝိုင္းေလးေတြ႕ေနရာမွာ Attribute ေျပာင္းပီးတစ္ျခားဟာေလးေတြေျပာင္းၾကည့္ရေအာင္။
Unorder List မွာ disc, square, circle
ဆိုပီးေျပာင္းလို့ရပါတယ္။Disc ကေတာ့ default ေပါ့။type ဆိၾတဲ့ attribute ကိုသံုးရမွာပါ
သံုးနည္းကေတာ့
< ul type="circle" >
...
...
...
< /ul > ဆိုပီးေတာ့ျဖစ္ပါတယ္။
circle ေနရာမွာပဲ disc နဲ႔ square ကိုေျပာင္းထည့္ၾကည့္လို႔ရပါတယ္။
နမူနာ code ကိုေလ့လာၾကည့္ပါ။
< html >
< head >
< title > Under List < /title >
< /head >
< body >
< u > Unorder List ( Attribute) < /u >
< ul type="circle" >
<li>First</li>
<li>Second</li>
<li>Third</li>
< /ul >
< /body >
< /html >
ပံုစံေလးေျပာင္းသြားတာကိုေတြ႔ကေမွာပါ။ဒီလိုမ်ိဳးပဲ square ကိုစမ္းၾကည့္ၾကပါ။ disc က ေတာ့ default မို႔လို႔ မစမ္းလဲရပါတယ္။
Order List ရဲ႕ Tag က
< ol > နဲ႔ < /ol > ပဲျဖစ္ပါတယ္။Unorder List နဲ႔ေရးသားနည္းတူတူပါပဲ။သူ႔ရဲ႕ Attribute ေတြကေတာ့ Unorder list နဲ႔တူပါတယ္ type attribute ပါပဲ။ေျပာင္းသြားတဲ့ဟာကေတာ့
1, A, a, I(ေရာမအကၡရာ), i(ေရာမအကၡရာ) တို႔ပဲဖစ္ပါတယ္။
ကဲ့နမူနာ code ေလးေတြၾကည့္လိုက္ရေအာင္ဗ်ာ။
< html >
< head >
< title > Order List < /title >
< /head >
< body >
< u > Unorder List(Attribute) < /u >
< ol type="1" >
<li>First</li>
<li>Second</li>
<li>Third</li>
< /ol >
< ol type="I" >
<li>First</li>
<li>Second</li>
<li>Third</li>
< /ol >
< /body >
< /html >
Output က
Defination List မွာ
dl ရယ္ dt ရယ္ dd ရယ္ဆိုပီး Tag 3 ခု႐ွိပါတယ္။
dl ကေတာ့ အပိတ္အဖြင့္ Tag ေပါ့ ol တို႔ ul တို႔လိုမ်ိဳးေပါ့။
dt ကေတာ့ Definition Term ပါ။တစ္နည္းအားျဖင့္ေခါင္းစဥ္ေပါ့။
dd က ေတာ့ defination ပါ။
< html >
< head >
< title > Defination List < /title >
< /head >
< body >
< u > Defination List < /u >
< dl >
<dt>HTML
<dd>Hyper Text Markup Language
<dt>Biology
<dd>Biology is the studying of living things.
< /dl >
< /body >
< /html >
သူ႔မွာထူးျခားတာက dt နဲ႔ dd tag ေတြမွာအပိတ္ tag မပါတာပဲဖစ္ပါတယ္။
defination list ကအသံုးေတာ့နည္းပါတယ္။
ကဲ့ဒီေလာက္ဆိုရင္ List ေတြပါတဲ့ page တစ္ခုကိုဖန္တီးလို႔ရပါပီ။
ဒီေန႔ေတာ့ဒီေလာက္ပါပဲ။ဖတ္ေပးတဲ့အတြက္ေက်းဇူးတင္ပါတယ္ ။ 😇
Written by @minthwayko
MSC - 187