Sunday, July 20, 2014

HTML පාඩම් මාලාව 3 - සරලව ඉගෙන ගන්න.




අප
මීට කලින් HTML පාඩම් මාල 1, 2 ඔබ අතට පත් කලා, අද ඔන්න අපි ගෙනාවා 03 වෙනි පාඩම.

අපි අද බලමු අප සාදන වෙබ් පිටුවකට වෙනත් වෙබ් අඩවි වලට සම්බන්ද විමට Link යොදා ගන්නා ආකාරය.මේවා හයිපර්ලින්ක් (Hyperlink) ලෙස නම් කරයි.මේවා ආකාර 3 කි.

  • External Links.
මෙය අපගේ වෙබ් අඩවියේ සිට වෙනත් වෙබ් අඩවියකට පිවිසීමට භාවිතා කරයි.
මෙම කේත.
 
<body>  හා  </body> යන Code අතර භාවිතා කරයි.
(
සැ.යු HTML පාඩම් මාලා 1 හා 2 අධ‍‍ය්‍යනය කරන්න. )
<a href=http://www.facebook.com> Facebook </a>

උදා : Facebook


මෙම Link එක මගින් අපව මෙය Click කිරිමෙන් Facebook වෙබ් අඩවියට යොමු කරයි,


  • Internal Links.

මෙය අපගේ වෙබ් අඩවියේම විස්තර ඇති  වෙනත් වෙබ් පිටුවකට අපව යොමු කරන Link  එකකි.

<p><a href ="#Prasanna madushanka"> About </a></p>
This is EXAMPLE
<a About="Prasanna madushanka"> About </a>
පේන්නේ මේ විදියට.

  • Navigation Links.
මෙය අපගේ වෙබ් අඩවියේ ඇති  වෙනත් වෙබ් පිටුවකට ඉක්මනින්  අපව යොමු කරන Link එකකි.
<nav>
      <a href=Home.html>  Home </a> |
      <a href=About.html>  About </a> |
      <a href=Service.html>  Service </a> |
</nav>

දර්ශනය වෙන්නේ මෙන්න මෙහෙම.


වෙබ්
පිටුවකට Images යෙදීම.


මේ සදහා <img> නම් tag එක හා  src නම් attribute එක භාවිතා කරයි.
<img src =”asd.jpg”/>



  • Image එකට බෝඩරයක් යෙදීම.
<img src ="asd.jpg"border=5/>   මෙහි 5 ලෙස දැක්වෙන අගය වෙනස් කිරීමෙන් බොඩරයේ ප්රමානය වෙනස් කර ගත හැකිය.



බලන්න කළු පාටින් බෝඩර් එක එන විදිය.
  • Image Tipsයෙදීම.

Image එක මතට Mouse  Pointer එක ගෙන ගිය විට විස්තරාත්මක දේවල් පෙන්වීමට මෙය භාවිතා කරයි.
<img src =”asd.jpg” title=”This is example”/>


  • Image එක  Click කල විට වෙනත් වෙබ් පිටුවකට ප්රවේශ විය හැකි ලෙස link කිරීම.
<a href="Home.html"> <img src ="asd.jpg" title= ”This_is_example”/>

ලොකු කරලා බලන්න මෙත මත click කරන.

  • වෙබ් පිටුවක පසුබිමට Image එකක් යෙදීම.
<body style ="background-image:url(asd.jpg)">
</body>





මෙමගින් අපගේ වෙබ් පිටු ඉතා අලංකාරවත් කර ගත හැකිය.අප ඊලග පාඩමෙන් වෙබ් පිටුවලට Audio සහ Video එක් කරන ආකාරය ඉගෙන ගනිමු.

No comments:

Post a Comment