html(hyper text markup language) සිංහලෙන් -04 lesson

html 03 පාඩම බැලුවේ නැත්තන් මෙතනින් යන්න

වෙබ් පිටුව තුල වගුවක් නිර්මාණය කිරීම.

මෙහිදී මූලික වශයෙන් tags කිහිපයක් භාවිත කරයි.

1.   <table>-වගුව ආරම්භ කරයි.

2.   <caption>-අවශ්‍ය නම් වගුවට මාතෘකාවක් ලබා දීම.

3.   <tbody>-වගුවේ අන්තර්ගතය සහිත කොටස ආරම්භ කිරීම.

4.   <tr>- table row මඟින් වගුවේ පේළියක් ආරම්භ කිරීම.

5.  <th>- table header මඟින් වගුවේ ව්සිරස් තීරුවක් ආරම්භ කිරීම.( මාතෘකා)

6.  <td>- table data මඟින් මාතෘකාවන්ට අදාළ විස්තර ඇතුළු කරයි.

Ex:-

<table border="1">

<caption>marks</caption>

<tbody>

<tr>

        <th>name</th>

        <th>sft</th>

        <th>et</th>

        <th>ict</th>

</tr>

<tr>

        <td>lahiru</td>

        <td>75</td>

        <td>70</td>

        <td>73</td>

</tr>

<tr>

        <td>chamod</td>

        <td>65</td>

        <td>60</td>

        <td>65</td>

</tr>

</tbody>

</table>

වගුවක Cell Merging කිරීම.

01. Column දෙකක් Merge කිරීම

<table width="300" border="1">
     <tr>
           <td colspan="2"> a&b </td>
          <td> c </td>
     </tr>
     <tr>
          <td> d </td>
          <td> e </td>
          <td> f </td>
  </tr> </table>

colspan නැමති Attribute  එක මගින් ඒක් වියයුතු Column ගණන තීරණය කරයි.

02. Row දෙකක් Merge කිරීම

<table width="300" border="1">
  <tr>
 <td rowspan="2">a&d</td>
 <td> b </td>
 <td> c </td>
</tr>
<tr>
<td> e </td>
<td> f </td>
</tr>
</table>

HTML Forms සහ Input

HTML forms භාවිතා කරනුයේ වෙබ් අඩවියට ඇතුලත් කරනු ලබන තොරතුරු 

server එකට pass කිරීමටය. <form> සහ </form> tag තුල සටහන් කරයි. 

Form එකක් තුල input යන element එක දැකිය හැක.

<form>

First name:

<input type="text" name="firstname" /><br />

Last name:

<input type="text" name="lastname" /><br />

</form>

Input Types

ඉහත දක්වා ඇති <input type="text" name="xxxxxx" />නමින්

ඇති input tag එකෙහි ඇති type නම් attribute එකෙහි අගය

වෙනුවට පහත දී ඇති attributes යොදා බලන්න.. 

Text - සටහන් කරන දැ වෙබ් පරිශීලකයාට දර්ශනය වේ.

Password - සටහන් කරන දැ වෙබ් පරිශීලකයාට දර්ශනය නොවන අතර ඒ

 වෙනුවෙන් අදුරු කල රවුම් පෙන්නුම් කරයි.

Button - බොත්තමක් පෙන්නුම් කරයි.

Image - පිංතුර දර්ශනය කරවීමට යොදා ගනී.

Radio - පරිශීලකයාට තේරීමක් කිරීම සදහා යොදයි.

Checkbox - පරිශීලකයාගෙ බහුවරණයන් සදහා යොදා ගනී.

Hidden - පරිශීලකයාට නොදැනුවත්වම සටහන් කරන දැ ලබා ගැනීමට.

Submit - මෙය බොත්තමක් ආකාරයෙන් පෙන්නුම් කරන අතර

 මෙය click කිරීමෙන් සටහන් කල දත්ත server එකට pass කරනු ලබයි.

Reset - මෙය බොත්තමක් ආකාරයෙන් පෙන්නුම් කරන අතර

 මෙය click කිරීමෙන් සටහන් කල දත්ත සියල්ල මැකී යයි.

Textarea

<textarea> යන tag එක තුල සටහන් කරනු ලබන අතර පරිෂීලකයගෙන් යම් විස්තරයක් ලබා ගැනීම සදහා යොදා ගනී.

<textarea name="description" rows="10" cols="50" ></textarea>

HTML Frames

වෙබ් අතිරික්සුව කොටස් වලට වෙන්කිරීමකට මෙම ටැග් එක යොදා ගනී.මෙසේ 

වෙන් කරන සෑම කොටසක්ම,වෙනමම වෙබ් පිටුවක් ලෙස ප්‍රධාන වෙබ් පිටුව තුළ 

පෙන්වයි. Frame එකක් යෙදීමේදී <frameset> හා <frame> යන tags භාවිත 

කරයි. 

<frameset cols="30%,*">

<frame name=”menu” src="menu.html"/>

<frame name=”content” src="content.html"/>

</frameset>