webdevlinux - logo Web Dev Linux

අනුක්‍රමයක් රහිත ලැයිස්තු (Unordered Lists)

අනුක්‍රමයක් නොමැති ලැයිස්තු වල යොමුව ලෙස සලකුණු භාවිතා වේ. ඒවා භාවිතා කරන ආකාරය පිළිබඳව මෙම ලිපියෙන් අධ්‍යයනය කරමු.

අනුක්‍රමයක් ඇති ලැයිස්තු වල මෙන් මෙම ලැයිස්තු වලදීද යොමුව සඳහා විවිධ සලකුණු භාවිතා කල හැකිය. නමුත් මෙහිදී type attribute එක භාවිතා කල නොහැක ( W3C ප්‍රමිතීන්ට අනුව). ඒ වෙනුවට style attribute එක යොදා ගත හැකිය.

HTML Unordered lists types HTML Unordered lists

පහළ උදාහරණය අත්හදා බලන්න.

FILE : unordered-lists.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML Unordered Lists</title>
</head>
<body>
<ul>
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
</ul>
<ul style="list-style-type:circle">
	<li>Item 1</li>
	<li>Item 2</li>
	<li>Item 3</li>
</ul>
<ul>
	<li>Item 1</li>
	<li style="list-style-type:square">Item 2</li>
	<li>Item 3</li>
</ul>
</body>
</html>

පැහැදිලිකිරීම

ඉහත උදාහරණයේ ඇති attributes පිළිබදව පැහැදිලිකිරීම පහලින් දක්වා ඇත.

style
HTML element එකකට style ලබාදීමට මෙම attribute එක යොදාගත හැකිය.
"list-style-type:circle"
මෙය CSS rule එකක් ලෙස හැඳින්වේ. CSS rule එකක් CSS property හා property value එකකින් සමන්විත වේ. මුලින්ම CSS property එකත් ඉන් පසුව : (semi-colon) සලකුණකින් පසුව property value එකත් පිහිටයි. උදාහරණයක් ලෙස මෙහි CSS property එක list-style-type වන අතර property value එක circle වේ.
circle, square, disc සහ none ලෙස list-style-type property එක සඳහා භාවිතා කල හැකි values 4කි.
style="list-style-type:circle"
යොමුව ලෙස කුඩා වලල්ලක් නිරූපණය වේ.
style="list-style-type:square"
යොමුව ලෙස කොටු සලකුණක් නිරූපණය වේ.
style="list-style-type:disc"
යොමුව ලෙස රවුමක් නිරූපණය වේ.
style="list-style-type:none"
යොමුව ලෙස කිසිවක් නිරූපණය නොවේ.