Friday, September 1, 2017

HTML සරලව ඉගෙන ගනිමු - 4 කොටස


මතකනේ ඔයාලා ගිය post එකෙන් html tags ඉගෙන ගන්න පටන් ගත්තානේ. අදත් අපි තව වැදගත් HTML Tag කිහිපයක් හඳුනාගනිමු. 

Heading Tags :
වෙබ් පිටුවක ශිර්ෂ ලිවීම සඳහා Heading tags භාවිතා කළ හැකිය. මෙහි අවස්ථා කිහිපයකි. 

<H1> This is paragraph </H1>  - අකුරු ප්‍රමාණය විශාලම 
<H2> This is paragraph </H2>
<H3> This is paragraph </H3>
<H4> This is paragraph </H4>
<H5> This is paragraph </H5>
<H6> This is paragraph </H6> - අකුරු ප්‍රමාණය කුඩාම


Paragraph and Break Tags :
වෙබ් පිටුව මත ඡේද ලිවීමට <P> </P> යන pair tag භාවිතා වේ. එසේම සකසන ඡේදයේ පේළි වෙන් කිරීම සඳහා <br/> single tag එක භාවිතා වේ. හොඳයි ඔයාලා පහත උදාහරණය කරලා බලන්නකෝ.



දැන් පහලින් තියෙන්නෙ result එක. බලන්න පොඩි අවුලක් තියෙනවා නේද? මම පේළි වෙන් කරලා තියෙන තැනින්ම browser එකේ පෙන්නන්නෙ නෑ නේද? මම ඡේද දෙකකට වෙන් කරලා ටයිප් කරලත් එහෙම පෙන්නලත් නෑ  නේද?


මොකක්ද අපි කරන්න ඕනා. හරි දැන් ඔයාලා ආයෙත් පහල තියෙන විදියට edit කරලා බලන්න. මම දැන් <P> tag 2 ක් දාලා තියෙන්නෙ. ඒ වගේම අවශ්‍ය තැන් වලට <BR> tags දාලා තියෙන්නෙ. එතකොට ගැටළුව විසඳිලා නේද?


මේ තියෙන්නෙ result එක,




දැන් ඔයාලට පුළුවන් word වල වගේම ඡේද Align කරන්න. (ඒ කිව්වෙ ලිපිය browser එකේ වමට, දකුණට, මැදට ගන්න පුළුවන් කියලා) පොඩි වැඩයි කරන්න තියෙන්නෙ. <P> tag එකට Align attribute එක එකතු කරන්න ඕනා. 


<P ALIGN="LEFT/RIGHT/CENTER/JUSTIFY"> 

උඩ තියෙන VALUE 4 න් එකක් දාලා කරලා බලන්නකෝ.  අනිවා වැඩ කරනවා. පහල තියෙන්නෙ මම උඩ උදාහරණ වලට ගත්ත ඡේද දෙක CENTER හා RIGHT ALIGN වලට දාලා ගත්ත image එකක්. ඔයත් කරලා බලන්නකෝ.


Update:
Justify attribute එක ලබාදෙන්නේ නම් <br/> භාවිතා කරන්න එපා. මේකෙන් ඡේදයේ දෙපැත්ත ( වම හා දකුණ ) සමබර කරන නිසා අපිට අවශ්‍ය තැනින් පේළි වෙන් කරන්න එපා.


හොඳයි අදට ඇති! ඔය ටික කරලා හොඳින් පුරුදු වෙන්න. 5 වෙනි post එකෙන් හමුවෙමු. ඔයාලගෙ අදහස් comment කරන්න. ඔයාලට පුළුවන් Facebook Fanpage එ‍කටත් එන්න. ඒ වගේම දන්න හැමෝටම Share කරලා මටත් සහයක් දෙන්න. හැමෝටම ජයවේවා - සුභ දවසක් !