Tuesday, November 10, 2015

වෙබ් අඩවිය යනු ?

වෙබ් අඩවිය යනු ?

Website හෝ Web Site යනු webpages (හෝ කෙටියෙන් pages) ලෙස හදුන්වන ලිපි ගොනු රාශියක එකතුවකි. මෙහි පිංතුර, වචන, බහු මාධ්‍ය ආදි දෑ අඩංගු වේ. Websites කොටස් 2කි.

Dynamic
Dynamic website යනු යම් පුද්ගලයෙකුට පමනක් ඉල්ලුම් කරන පිටුව පෙන්වන web අඩවි වේ.
උදා : www.facebook.com

Static
Static website යනු ඉල්ලුම් කරන web පිටුව ඉල්ලුම් කරන සැමට එක විදිහටම ලබා දෙන web අඩවි  වේ.
උදා : www.wikipedia.org

HTML ලෙඛණ හෙවත් වෙබ් පිටු

HTML ලෙඛණ හෙවත් වෙබ් පිටු

HTML ලේඛණ වෙබ් පිටු ලෙසද හදුන්වයි. HTML ලේඛණ HTML tags වලින් සහ අකුරු වලින් සමන්විත වේ.

Sample Code :

<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph</p>
</body>
</html>

<html> සහ </html> අතර වෙබ් පිටුව විස්තර කෙරේ
<body> සහ </body> අතර වෙබ් පිටුවෙහි පරිශීලකයාට දර්ශනය වන කොටස
<h1> සහ </h1> අතර මාතෘකා ආදිය දර්ශනය කරවයි
<p> සහ </p> අතර ඡෙද ආදිය දර්ශනය කරවයි

HTML



Dreamweaver සහ Front Page වැනි වු මෘදුකාංග මගින් HTML ලිවීම සහ සංශෝධනය කළ හැකිවේ.

HTML Headings

HTML headings <h1> සිට <h6> දක්වා tags වලින් විග්‍රහ කෙරේ.

<h1>This is a headline</h1>
<h2>This is a headline</h2>
<h3>This is a headline</h3>

HTML Paragraphs

HTML paragraphs <p> tag එකෙන් විග්‍රහ කරයි.

<p>This is a paragraph</p>
<p>This is another paragraph</p>

HTML Links

HTML links <a> tag වලින් විග්‍රහ කෙරෙයි.

<a href="http://www.facebook.com/">This is a link</a>

HTML Images

HTML images <img> tag වලින් විග්‍රහ කෙරෙයි.

<img src="yourimage.jpg" width="104" height="142" />

HTML Elements

HTML Elements

HTML elements ආරම්භක සහ අවසාන tags වලින් සමන්විත වේ. Elements අන්තර්ගතයන් සැම විටම ආරම්භක සහ අවසාන tags අතර දක්නට ලැබේ. සමහර HTML elements හිස්ව පවතී. එවැනි හිස්ව පවතින elements ආරම්භක tags වසාලනු ලැබේ. HTML elements සතුව attributes පවතී.

<p>
This is a paragraph
</p>

<a href="default.htm">
This is a link
</a>

<br />

ඊට උදාහරණ වේ.

HTML Tip

HTML Tip

HTML tags අක්ෂර සංවේදීතාවයෙන් (case sensitive) තොර වේ : <P> tag එකෙන් හැගවෙන අර්ථයමයි <p> tag එකෙනුත් හැගවෙන්නෙ. සමහර වෙබ් අඩවි කැපිටල් අකුරින් HTML tags ලියනු ලබයි.

HTML Attributes

HTML elemets සතුව attributes පවතී. Attributes, elements පිළිබදව තවත් තොරතුරු පෙන්නුම් කරයි. මේවා සැම විටම ආරම්භක tag තුල විශේෂයෙන් සටහන් කරයි. Attributes සතුව name="value" මෙවැනි නමක් සහ අගයක් දක්නට ලැබේ.

Example :

<a href="http://www.facebook.com/">This is a link</a>

<img src="yourimage.jpg">

<p id="italicsparagraph">Paragraph type 1 Italics</p>

<input type="text" name="TextField" />

HTML Lists

HTML Lists


මේවා තුන් ආකාරයකට දැක ගත හැකි වේ. ඒවා නම්,
<ul> - unordered list; මෙහිදී යම් යම් සළකුණු මගින් ලැයිස්තු සාදා පෙන්වයි.
<ol> - odered list; මෙහිදී අංක මගින් ලැයිස්තු සාදා පෙන්වයි.
<dl> - definition list; මෙහිදී ශබ්ධකෝෂයක් ආකාරයට ලැයිස්තු සාදා පෙන්වයි.
මෙහිදී <li> යනු List Item හෙවත් ලැයිස්තු අංගයන්ය.

Unorded List

<ul>
<li>Milk</li>
<li>Tea</li>
<li>Car</li>
<li>Bread</li>
</ul>

Unorded List වර්ග තුන් ආකාර වේ. ඒවානම්,
Circle; මැද හිස්වු වෘත්ත
Disc; මැද පිරවු වෘත්ත
Square; මැද පිරවු චතුරශ්‍ර

Circle
<ul type="circle">
<li>Milk</li>
<li>Tea</li>
<li>Car</li>
<li>Bread</li>
</ul>

Disc
<ul type="disc">
<li>Milk</li>
<li>Tea</li>
<li>Car</li>
<li>Bread</li>
</ul>

Square
<ul type="square">
<li>Milk</li>
<li>Tea</li>
<li>Car</li>
<li>Bread</li>
</ul>

Ordered Lists

<ol>
<li>HTML</li>
<li>CSS</li>
<li>Java Script</li>
</ol>

Orded List වර්ග සිවු ආකාර වේ. ඒවානම්,
<ol type="a"> සිම්පල් අකුරු පදනම් කරගනිමින් ලැයිස්තු සාදයි
<ol type="A"> කැපිටල් අකුරු පදනම් කරගනිමින් ලැයිස්තු සාදයි
<ol type="i"> සිම්පල් අංක පදනම් කරගනිමින් ලැයිස්තු සාදයි
<ol type="I"> කැපිටල් අංක පදනම් කරගනිමින් ලැයිස්තු සාදයි

Definition වර්ගයේ Lists වලදී tags වර්ග තුනක් දැක ගත හැකි වේ.
<dl> ලැයිස්තුවේ ආරම්භය සටහන් කරයි.
<dt> විස්තර කල යුතු වචනය මෙහි සටහන් කරයි.
<dd> වචනයට අදාල විස්තරය සටහන් කරයි.

<dl>
<dt>HTML</dt>
<dd>Hyper Text Markup Language</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets</dd>
</dl>

HTML Forms සහ Input

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

Text - සටහන් කරන දැ වෙබ් පරිශීලකයාට දර්ශනය වේ.
Password - සටහන් කරන දැ වෙබ් පරිශීලකයාට දර්ශනය නොවන අතර ඒ වෙනුවෙන් අදුරු කල රවුම් පෙන්නුම් කරයි.
Submit - මෙය බොත්තමක් ආකාරයෙන් පෙන්නුම් කරන අතර මෙය click කිරීමෙන් සටහන් කල 
ත්ත server එකට pass කරනු ලබයි.
Button - බොත්තමක් පෙන්නුම් කරයි.
Image - පිංතුර දර්ශනය කරවීමට යොදා ගනී.
Radio - පරිශීලකයාට තේරීමක් කිරීම සදහා යොදයි.
Reset - මෙය බොත්තමක් ආකාරයෙන් පෙන්නුම් කරන අතර මෙය click කිරීමෙන් සටහන් කල  දත්ත සියල්ල මැකී යයි.
Checkbox - පරිශීලකයාගෙ බහුවරණයන් සදහා යොදා ගනී.
Hidden - පරිශීලකයාට නොදැනුවත්වම සටහන් කරන දැ ලබා ගැනීමට.

Textarea

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

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

HTML Frames

වෙබ් අඩවිය කොටස් වලට වෙන්කිරීමකට යොදා ගනී.

<html>
<head>
</head>
<frameset cols="30%,*">
<frame src="menu.html">
<frame src="content.html">
</frameset>
</html>

Disqus Shortname

Ads Inside Post

Comments system