[ HTML ] Part : 05

[ HTML ] Part : 05

පසුගිය ‍post එකෙන් ඔයාලට මතක ඇති මම HTML tags/HTML Elements ගැන පැහැදිලි කිරීමක් කරා. එහිදී මම HTML tags/HTML Elements ගැන මෙන්ම එම HTML tags/HTML Elements වල උපලක්ෂණ ගැනත් සරලව කතාකරා. නමුත් එහිදී මම කරේ HTML tags/HTML Elements වල Attributes(ටැගන්හි උපලක්ෂණ) ගැන මූලික හඳුන්වාදීමක් කිරීමක් විතරයි. අද මම බලා පොරොත්තු වෙනව HTML tags/HTML Elements වල Attributes(ටැගන්හි උපලක්ෂණ) ගැන සවිස්තරව කතා කරන්න.

මෙම උපලක්ෂණ වලින් කෙරෙන්නෙ basic HTML elements වලට වැඩිපුර ගුණාන්ග එකතු කිරීමයි. තවදුරටත් කියනවානම් කිසියම් HTML element එකක් තවදුරටත් විස්තරකිරීමක්. හොඳයි මේ වෙනකොට ඔයාලට පැහැදිලියි HTML Attributes වලින් සිදුකරනු ලබන දේ. දැන් මම ඔයාලට කියල දෙන්න හදන්නෙ කොහොමද මෙම උපලක්ෂණ HTML Element වලට ඇතුලත් කරගන්නෙ කියල සහ එහිදී පිළිපැදිය යුතු නීති රීති කිහිපයක් ගැන. එකින් එක එම කරුණු පැහැදිලි කරනවානම්

01: අනිවාර්යෙන්ම සියලුම උප ලක්ෂණ(Attributes) ඇතුලත් කරයුතු වන්නේ HTML Element වල ආරම්භක ටැගයටයි(Opening tag/Starting tag).

02: සැම විටම HTML Attributes(උප ලක්ෂණ) ඇත්තේ කොටස් දෙකක් ලෙසටය එනම් යුගල වශයෙන්. එම යුගල වන්නේ උප ලක්ෂණයේ නම Name of Attribute සහ උප ලක්ෂණයේ අගය Value of Attribute ලෙසටය. දැන් ඔයාල දන්නවා අනිවාර්යෙන්ම උපලක්ෂණ සඳහා උප ලක්ෂණ නාමය හා උප ලක්ෂණ අගය ලෙසට කොටස් දෙකක් පවතිණ බව. හැබැයි උපලක්ෂණ අගය සඳහා අනිවාර්යෙන්ම අගයක් තිබිය යුතුමය කියල නීතියක් නැහැ.

03: උප ලක්ෂණ නාමය ඔබට කැමති ආකාරයට යොදන්න බැහැ. ඒවා යම් අන්තර්ජාතික සම්මුතියකට යටත්ව සැකසුනු නාම. ගෝලීය වශයෙන් සියල්ලෝම එම සම්මුති වලට අනුව ක්‍රියාකල යුතු වනව. එනම් එම නාම non pre-defined ගණයට වැ‍ටෙනව. යම් කෙනෙකුට ඕනෙනම් තමන් කැමති නම්ක් ඒසඳහා යොදන්න පුලුවන් හැබැයි ඉතින් ‍එහෙම කන්නෙ පිස්සො:P. මොකද එහෙම කරාම වැඩකරන්නෙ නැහැනෙ!

මෙතරම් වෙලා පැහැදිලි කරා විතරයිනෙ! දැන් අපි බලමු උප ලක්ෂණ ලියන ආකාරය සඳහා උදාහරණයක්

<div id="nalaka"></div>

ඉහත උදාහරණයේ <div></div> කියන්නෙ HTML වල එන බහුලව බාවිතාවන(මේ ගැන පසුවට සවිස්තරව කතාකරනව) HTML MARKUP tag එකක්. හොඳින් බලන්න එහි මුල්ටැගයේ හෙවත් ආරම්බක ටැගයේ(Starting tag/Opening tag) ඇතුලත් කර තිබෙන id="nalaka" කොටස. මෙම කොටසේ ඔයාලට දකින්න පුලුවන් ප්‍රධාණ ‍කොටස් කිහිපයක්

01 id
02 =
03 ""
04 nalaka

මෙහි id කියන කොටසට තමයි මම කලින් පැහැදි කල උප ලක්ෂණ නාමය කියන්නේ.  = ලකුණ සෑම විටම උප ලක්ෂණ නාමයට පසුව බාවිතා වෙනව. ඉන්පසු ඔබ අනිවාර්යෙන්ම ""(ද්වි උද්ධෘත පාඨ ලක්ෂණ) ලකුණු තුල තමයි nalaka යනුවෙන් තිබෙන උප ලක්ෂණ අගය(value) එක සටහන් කල යුතු වන්නෙ.මෙහිදි ""(ද්වි උද්ධෘත පාඨ ලක්ෂණ) ලකුණුම යෙදීම අනිවාර්ය නැහැ. නමුත් වඩාත් බාවිතාවන ක්‍රමය(Common method) මේක තමයි. මේ සඳහා උබට අවශ්‍යනම් ''(තනි උද්ධෘත පාඨ ලක්ෂණ) ලකුණු වුවද ‍යොදා ගත හැකියි.මෙහිදී ''(තනි උද්ධෘත පාඨ ලක්ෂණ) යෙදීම අනිවාර්යය වන අවස්තාද ඇත ඒ සඳහා උදාහරණ මෙම post එක කියවගෙන යනකොට හම්බ වෙයි.

අනිත් විශේෂ දේ තමයි HTML Attribute(උප ලක්ෂණ) ලියන අකුරු ඉංග්‍රීසි කැපිටල් අකුරුද සිම්පල් අකුරුද කියන එක මත වෙනස් වෙනව.සරලව කිව්වොත් ඔය කියන්නේ HTML Attribute(උප ලක්ෂණ) case-insensitive කිලනේ.මේ සඳහා උදාහරණයක් බලමු

01 id="Nalaka"
02 id="nalaka"

ඉහත උදාහරණ අංක 01 උප ලක්ෂණ අගයවන Nalaka යන්නෙහි මුල් අකුර ඉංග්‍රීසි කැපිටල් අකුරක් බව ද 02 උදාහරණයෙහි මුල් අකුර ඉංග්‍රීසි සිම්පල් අකුරක්(බලන්නකො ඉංග්‍රීසිත් සිංහලෙන් ලියන්න උන හැටි, LOL) බවද ඔබලාට පේනව. එම නිසා මෙහිදී උප ලක්ෂණ අගයන් දෙක අගයන් එකක් ලෙසට නොව අගයන් දෙකක් ලෙසටයි ගනු ලබන්නෙ. ලෝකයේ Web standards(සම්මතයන්) හඳුන්වා දෙන w3c(World Wide Web Consortium) ආයතනය HTML4 සංස්කරණය සඳහා HTML Attribute(උප ලක්ෂණ) ලියන කොට හැකි සෑම අවස්තාවකදීම ‍English Simple Letters බාවිතා කරන්න කියල නිර්දේශ(Recomend) කරල තියෙනව.හැබැයි ඕනෙම නම් English Capital Letters වලිනුත් HTML4 සඳහා HTML Attribute(උප ලක්ෂණ) ලියන්න පුලුවන්. නමුත් HTML4 සංස්කරණයට පසුව ආ HTML වල නවතම සංස්කරණය වන XHTML සඳහානම් HTML Attribute(උප ලක්ෂණ) ලියන කොට අනිවාර්යෙන්ම English Simple Letters බාවිතා කරන්නම වෙන‍ව.

මම ඔයාලට පොරොන්දුවුනා ''(තනි උද්ධෘත පාඨ ලක්ෂණ) යෙදීම අනිවාර්ය වන අවස්තාක් සඳහා උදාහරණයක් දෙනවයි කියල.මෙසේ ''(තනි උද්ධෘත පාඨ ලක්ෂණ) යෙදීම අනිවාර්යවෙන්නෙ අපි බාවිතා කරණ උප ලක්ෂණයේ අගය සඳහා ""(ද්වි උද්ධෘත පාඨ ලක්ෂණ) ලකුණු යොදන්න වන තැන්වලදි. මේ ස‍ඳහා මම බාවිතා කරන්න යන්නෙ HTML වල Hyperlinks යොදන්න බාවිතා කරන HTML වල තියෙන <a></a> නම් tag එක. එම ටැගයට Hello "Nalaka" kohomada කියන වාක්‍යය සඳහා title නම් HTML Attribute එක දෙන්න තමයි මම හදන‍්නෙ. ඇත්තටම මොකක්ද Hello "Nalaka" kohomada කියන වාක්‍යයේ තියෙන විශේෂත්වය? ඔයාල හොඳින් බැලුවොත් දකින්න ලැ‍බෙයි Nalaka කියන වචනය ""(ද්වි උද්ධෘත පාඨ ලක්ෂණ) ලකුණුතුලු පවතින බව. හොදයි අපි බලමු මෙය coding කරන ආකාරය.

<a title='Hello "Nalaka" kohomada'>click here</a>

මීට අදාල මවිසින් සකසන ලද පහත රූප සටහන හොඳින් නිරීක්ෂණය කරන්න.

රූපය පැහැදිලි නොමාතිනම් එය මත Click කරන්න

Hello "Nalaka" kohomada කියන වාක්‍යය ""(ද්වි උද්ධෘත පාඨ ලක්ෂණ) ලකුණු තුලට දමා බලමු කුමක්ද ලැබෙන ප්‍රතිපලය කුමක්ද කියා මී‍ට අදාල පහත රූප සටහන හොඳින් නිරීක්ෂණය කරන්න. එවිට දක්නට ලැබෙයි හාත්පසින්ම වෙනස් ප්‍රතිපලයක් එන ආකාරය

රූපය පැහැදිලි නොමාතිනම් එය මත Click කරන්න

මේ සඳහා HTML කේතය(code) ලිවිය යුතුවන්නේ මේ ආකාරයටයි.

<a title="Hello "Nalaka" kohomada">click here</a>


සැ. යු:- ඉහත උදාහරණ දෙක සඳහාම බාවිතා කරණලද <a></a> ටැගයන් සඳහා <a></a> ටැග්වලටම සුවිශේෂී වූ href නැමති උප ලක්ෂණය(Attribute) බාවිතා කර නොමැත.


සැ. යු:- HTML වල විවිද ටැගයන් සඳහාම ආවේණික වූ උප ලක්ෂණ ඇතුවා මෙන්ම බොහෝ ටැගයන් සඳහා පොදු වන්නාවූ උප ලක්ෂණයන්ද ඇත.