Category 1

Monday, March 30, 2015

CSS හැඳින්වීම.

CSS මුලිකාංග.



CSS කියන්නනේ Cascading Style Sheet.මේ CSS කියන භාෂාව හඳුන්වා දෙනු ලැබුවේ වෙබ් පිටුවක Appearance එක Describe කරනකොට.

ඒ කියන්නේ අපිට HTML වගේ භාෂාවක් යොදාගෙන Design කරන  වෙබ් පිටුවක් වඩාත් ආකර්ශනීය ලෙස සකස් කරන්න තමයි CSS වගේ භාෂාවක් යොදා ගන්නේ.

CSS හඳුන්වා දෙන ලද්දේ 1996දිය. මුල් ම වරට CSS හඳුන්වා දෙන ලද්දේ W3C එක විසිනි.

CSS වලින් වෙබ් පිටුවක සිදු වන Process එකක් කරන්න බැහැ. සිදු කල හැක්කේ Publish නැත්නම් ප්‍රදර්ශනය කිරීම පමණයි. එමෙන්ම CSS මගින් පමණක් වෙබ් පිටුවක් Develop කල නො හැකි අතර HTML අනිවාර්යයෙන් යොදා ගත යුතු ය.

CSS යොදා ගනිමින් සිදුකරගන්නා ලද වෙබ් පිටුවක් ඕනෑම web browser එකක හා ඕනෑම Device එකක run කල හැක.

 අපි බලමු CSS Syntax වල Structure එක. 



මේ CSS Syntax වල ප්‍රධාන කොටස් 3ක් තියනවා.

Selector- HTML වලින් CSS වෙන් කර ගැනීම.

 Declaration -හඳුනා ගැනීම ප්‍රකාශ කිරීම නොහොත් CSS tag එක ප්‍රකාශ කිරීමයි.

 Declaration හි width යනු property එක වන අතර 36px යනු value එක වේ.

 මේක තමයි Structure එක CSS වල Syntax ලියන.

මීළඟ tutorial එක නැරඹීමට click කරන්න.
byShanaka's Flutter Projects
in
4:50 AM

CSS introduction sinhala tutorial

CSS හැඳින්වීම. CSS මුලිකාංග. CSS කියන්නනේ Cascading Style Sheet.මේ CSS කියන භාෂාව හඳුන්වා දෙනු ලැබුවේ වෙබ් පිටුවක Appearance එක De...
Read More

Java Script ආරම්භය.

Java Script ඉගෙනගනිමු.

අපි බලමු කොහොමද Java script වලින් යම් වාක්‍යයක්(Text එකක්) display කර ගන්නේ කියලා.

මේ සඳහා document.write() කියන method එක භාවිතා කරනවා.

උදාහරණයක් බලමු :-
<html>
</head>
<body>
<script type="text/javascript">
document.write("java script lesson")
</script>
</body>
</html>

මේක HTML Document එකක් විදියට save කරගෙන web browser එකක් හරහා Run කර බලන්න.


Java Script වල comment යෙදීම.

මෙහිදී comment යොදන ආකාර 2කි.

1.One line comment
මේ සඳහා // භාවිතා කරයි.

<script
document.write("My first JavaScript") // this is the comment
</script>

2.Multiple line comment
මේ සඳහා

/* This whole section is commented
out so it is not treated as a part of
the script. */
ලෙස ලිවිය හැකිය.

මීළඟ tutorial එක නැරඹීමට next මත click කරන්න.
byShanaka's Flutter Projects
in
12:36 AM

java script comment sinhala tutorial

Java Script ආරම්භය. Java Script ඉගෙනගනිමු. අපි බලමු කොහොමද Java script වලින් යම් වාක්‍යයක්(Text එකක්) display කර ගන්නේ කියලා. මේ සඳහ...
Read More

Java Script හැඳින්වීම.

Java Script ඉගෙනගනිමු.



Java Script ඉගෙන ගැනීමට නම් අපිට HTML දැනුම අනිවාර්යයෙන් තිබිය යුතුමයි.

ඇයි මේ Java Script වෙබ් පිටුවකට අවශ්‍ය වෙන්නේ,

අපි කලින් ඉගෙන ගත්ත HTML, CSS වගේ Language වලින් සිදු කල හැක්කේ Publishing විතරයි.ඒ කියන්නේ වෙබ් පිටුව ප්‍රදර්ශනය කිරීම පමණයි.

නමුත් Java Script වලින් ගණිතමය හා තාර්කික කටයුතු සිදු කිරීම කල හැකිය.
මුලින්ම අපි බලමු කොහොමද Java Script එකක් HTML Document  එකක් සමග සම්බන්ධ කර ගන්නේ කියලා.

මේ සඳහා HTML වල <script > tag එක පාවිච්චි කරනවා.

java script එකක් HTML Document එකකට සම්බන්ධ කර ගන්න <script> tag එක යොදා ගන්නවා.මෙයට closing ටැග් එකක් ඇත.

අපේ java script coding සිදු කර ගන්නේ මේ <script> tag තුල වේ.

<script type="text/javascript">
උදා:-
 
<html>
<title>Java Script</title>
<body>
<script type="text/javascript">
</script>
</body>
</html>

Java script වල විශේෂතා.

මෙය object oriented language එකකි.

Case sensitive language එකකි.

java පරිගණක භාෂාවට ගොඩාක් දුරට සමාන නමුත් මෙය web developing language එකකි.

java script මගින් අපේ වෙබ් පිටුවේ සිදුවන සියලුම ගණිතමය හා තාර්කික කටයුතු සිදු කර ගත හැක.
වෙබ් පිටුවේ ඕනෑම ස්ථානයක යොදා ගත හැක.

වෙබ් පිටුව වඩාත් අර්ථවත් කර ගත හැක. 

අපි මීළඟ tutorial එකෙන් බලමු කොහොමද java script වලින් වැඩ කරන්නේ කියලා.
byShanaka's Flutter Projects
in
12:28 AM

java script sinhala tutorial introduction

Java Script හැඳින්වීම. Java Script ඉගෙනගනිමු. Java Script ඉගෙන ගැනීමට නම් අපිට HTML දැනුම අනිවාර්යයෙන් තිබිය යුතුමයි. ඇයි ...
Read More

Friday, March 27, 2015

HTML Background සැකසීම.


HTML වෙබ් පිටුවකට Background සැකසීම.

වෙබ් පිටුවට පසුබිම් රූපයක් එකතු කිරීම.

මේ සඳහා අපි සාමාන්‍යයෙන් භාවිතා කරන <body> tag එක භාවිතා කරයි.


<body background=”url”>


මෙහිදී url එක වෙනුවට අදාළ image එකේ නම ලබා දිය හැක.මෙහිදී අදාළ image එක html document එක

save කරන local disk එකේම තිබිය යුතුයි.

හැබැයි වෙනම local disk එකක හෝ වෙබ් පිටුවක තියනවා නම් url එක සම්පුර්ණයෙන්ම ලබා දිය යුතුය.


වෙබ් පිටුවට පසුබිම් පැහැයක් එකතු කිරීම.

<BODY BGCOLOR="#rrggbb"> document-body</BODY>

<BODY BGCOLOR="colorname"> document-body</BODY>


මෙහිදී අදාළ පැහැයේ hexadecimal අගය ලබා දිය යුතුය.නැත්නම් color name එක ලබා දිය යුතුය.

මීළඟ tutorial එක නැරඹීමට next මත click කරන්න.
byShanaka's Flutter Projects
in
5:08 AM

HTML Backgrounds

HTML Background සැකසීම. HTML වෙබ් පිටුවකට Background සැකසීම. වෙබ් පිටුවට පසුබිම් රූපයක් එකතු කිරීම. මේ සඳහා අපි සාමාන්‍යයෙන් භා...
Read More

හරස් ඉරි (Horizontal line) එකතු කිරීම.





අපි HTML වලදී වෙබ් පිටුව නිර්මාණය කර ගැනීම සිදු කර ගන්නේ <body> </body> tag තුල බව අපි කලින් පාඩමේදී කතා කළා.

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

මේ සඳහා <hr> tag එක යොදා ගන්නා අතර එම ඉරි වලට style එකතු කල හැක.


<html>
<head><title>My first web page</title>
</head>
<body>
<hr>
</body>
</html>
<HR SRC= "URL">

<HR SIZE= number>

Line එකේ size එක, නැත්නම් මහත තීරණය කරයි.මම මේ සඳහා 50px ලෙස ලබා දෙනවා.

<html>
<head><title>My first web page</title>
</head>
<body>
<HR SIZE= 50px>
</body>
</html>
Line එකට color එකක් එකතු කිරීම.

<HR COLOR="colorname">

මෙහිදී අදාළ පැහැයේ hexadecimal අගය ලබා දිය යුතුය.නැත්නම් color name එක ලබා දිය යුතුය.මම color
name එක red ලෙස ලබා දෙනවා.



<html>
<head><title>My first web page</title>
</head>
<body>
<HR COLOR="red">
</body>
</html>
<HR WIDTH= number %>

 Line එකේ දිග තීරණය කරයි.මෙය ප්‍රතිශතයක් වශයෙන් ලබා දිය යුතුය.මම මෙහි අගය 50% ලෙස ලබා දෙනවා.

<html>
<head><title>My first web page</title>
</head>
<body>
<HR COLOR=50%>
</body>
</html>
<HR ALIGN= alignment>

Line එකේ arrangement එක තීරණය කරයි.

වමට බරව පිහිටන විට “left”
මධ්‍යයේ පිහිටන විට “center”
දකුණට බරව පිහිටන විට “right”

මීළඟ tutorial එක නැරඹීමට next මත click කරන්න.
byShanaka's Flutter Projects
in
5:04 AM

Add horizontal line for html page

හරස් ඉරි ( Horizontal line) එකතු කිරීම. අපි HTML වලදී වෙබ් පිටුව නිර්මාණය කර ගැනීම සිදු කර ගන්නේ <body> </body> tag ...
Read More

HTML Comment එකතු කිරීම.

HTML වෙබ් පිටුවකට Comment එකතු කිරීම.



අපිට HTML වෙබ් පිටුවක් තුල අපේ පහසුව සඳහා වෙබ් පිටුව තුල දර්ශනය නොවන ලෙස යම් අදහසක් ලියා තැබිය හැකිය.

මෙය web browser එක මගින් display නොකරයි.

EX:-
<!--Comment-->


<html>
<head><title>My first web page</title>
</head>
<body>
<hr> <!--horizontle rule-->
</body>
</html>

මීළඟ tutorial එක නැරඹීමට next මත click කරන්න.
byShanaka's Flutter Projects
in
4:58 AM

Add comment to html web page

HTML Comment එකතු කිරීම. HTML වෙබ් පිටුවකට Comment එකතු කිරීම. අපිට HTML වෙබ් පිටුවක් තුල අපේ පහසුව සඳහා වෙබ් පිටුව තුල දර්ශනය නොව...
Read More

Headings එකතු කිරීම.




HTML වෙබ් පිටුවකට Heading එකතු කිරීම.

අපිට HTML වෙබ් පිටුවක් තුල අකුරු ප්‍රමාන 6ක Heading එකතු කර ගත හැක.

මේ සඳහා යොදා ගන්නේ <h1> , <h2> , <h3> , <h4> , <h5> , <h6> යන tag වේ.


මෙහිදී <h1> සිට <h6> දක්වා අකුරු ප්‍රමාණය ක්‍රමයෙන් අඩු වේ.

උදාහරණය බලන්න.

<html>
<head><title>My first web page</title>
</head>
<H1>HTML is Easy</H1>
<h2>HTML is Easy</h2>
<h3>HTML is Easy</h3>
<h4>HTML is Easy</h4>
<h5>HTML is Easy</h5>
<h6>HTML is Easy</h6>
</html>

HTML is Easy

HTML is Easy

HTML is Easy

HTML is Easy

HTML is Easy
HTML is Easy
මෙහිදී අපිට මේ heading එක වෙබ් පිටුව වම් පසට,දකුණු පසට,හා පිටුව මැදට set කල හැක.

මේ සඳහා align යන attribute එක යොදා ගනු ලබයි.

Ex:-
<h1 align="center">Example Code</h1>

Example Code


Ex:-
<h1 align="left">Example Code</h1>

Example Code



Ex:-
<h1 align="right">Example Code</h1>

Example Code

මීළඟ tutorial එක නැරඹීමට next මත click කරන්න.
byShanaka's Flutter Projects
in
4:54 AM

Add headings to HTML web page

Headings එකතු කිරීම. HTML වෙබ් පිටුවකට Heading එකතු කිරීම. අපිට HTML වෙබ් පිටුවක් තුල අකුරු ප්‍රමාන 6ක Heading එකතු කර ගත හැක. ම...
Read More

 

Sinhala IT tutorial © 2015 - Designed by Templateism.com, Plugins By MyBloggerLab.com