Order list
April 1, 2010 at 5:27 pm | Posted in HTML Basic By Examples | Leave a comment<html> <head> <title>order list</title> </head> <body> <ol> <li>Introduction</li> <li>Objectives</li> <li>Conclusion</li> </ol> </body> </html>
Order list ကလည္း Unorder list နဲ႔ သိပ္မကြာလွပါဘူး။ သူက default အေနနဲ႔ 1., 2., … ဆိုၿပီးေပၚတာကိုေတြ႔ရမွာပါ။ ဒါေတြအျပင္
decimal (1,2,3)
lower roman (i, ii, iii)
upper roman (I, II, III)
lower alpha (a, b, c)
upper alpha (A, B, C)
တို႔ကိုသံုးလည္းရပါတယ္။ ေအာက္မွာ Example ျပထားပါတယ္။
<html> <head> <title>order list</title> </head> <body> <ol type="i"> <li>Chapter One</li> <li>Chapter Two</li> <li>Chaper Three</li> </ol> <ol type="a"> <li>Chapter One</li> <li>Chapter Two</li> <li>Chaper Three</li> </ol> </body> </html>
Output:
- Chapter One
- Chapter Two
- Chaper Three
- Chapter One
- Chapter Two
- Chaper Three
ဘယ္ကစမယ္ဆိုတာကို start attribue ေလးနဲ႔ျပလို႔ရပါတယ္။
<html> <head> <title>order list</title> </head> <body> <ol type="i" start="3"> <li>Chapter One</li> <li>Chapter Two</li> <li>Chaper Three</li> </ol> <ol type="a" start="4"> <li>Chapter One</li> <li>Chapter Two</li> <li>Chaper Three</li> </ol> </body> </html>
Output
- Chapter One
- Chapter Two
- Chaper Three
- Chapter One
- Chapter Two
- Chaper Three
<html> <head> <title>order list</title> </head> <body> <ol> <li>Chapter One</li> <li>Chapter Two</li> <ul> <li>Part A</li> <li>Part B</li> <li>Part C</li> </ul> <li>Chapter Three</li> </ol> </body> </html>
ဒါကေတာ႔ order list နဲ႔ unorder list ကိုတြဲသံုးထားတာပါ။
Unorder List
March 27, 2010 at 10:05 am | Posted in HTML Basic By Examples | Leave a comment
<html>
<head>
<title>Unorder List</title>
</head>
<body>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>
Ourput:
- HTML
- CSS
- JavaScript
ဒါကေတာ႔ unorder list ပါ။ list ေရွ႕မွာ အစက္ေလးေတြပါတာေတြ႕ရမွာပါ။ အစက္ေလးေတြကို ပံုစံေျပာင္းလို႔ရသလို မထည့္ရင္လည္းရပါတယ္။
<html>
<head>
<title>Unorder List</title>
</head>
<body>
<ul type="disc">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<ul type="circle">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<ul type="square">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<ul type="none">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>
Output:
- HTML
- CSS
- JavaScript
- HTML
- CSS
- JavaScript
- HTML
- CSS
- JavaScript
- HTML
- CSS
- JavaScript
ပထမဆံုး disc ဆိုတဲ့အမ်ိဳးအစားက default ျဖစ္ပါတယ္။ ေနာက္ဆံုးတစ္ခု ကေတာ႔ ဘာမွမထည့္ခ်င္ရင္သံုးေပါ႔။
<html>
<head>
<title>Nested</title>
</head>
<body>
<ul>
<li>HTML
<ul>
<li>Heading tag</li>
<li>Unorder List
<ul>
<li>disc</li>
<li>circle</li>
<li>square</li>
</ul>
</li>
<li>Order List</li>
</ul>
</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>
Output:
- HTML
- Heading tag
- Unorder List
- disc
- circle
- square
- Order List
- CSS
- JavaScript
ဒါကေတာ႔ အဆင့္ဆင့္ list လုပ္တဲ့ပံုစံေလးေပါ႔။ ေသခ်ာၾကည့္ရင္နားလည္မွာပါ။
-
My Favourite Blog of this week- An error has occurred; the feed is probably down. Try again later.
Blog at WordPress.com. | Theme: Pool by Borja Fernandez.
Entries and comments feeds.
