චමියගෙ I.T සටහන්: December 2015

Monday, December 21, 2015

WEB ඉගෙන ගනිමු - 2 පාඩම

කලින් පාඩමේදි අපි කථා කරන්න පටන් ගත්තා HTML මුල හරිය.
දෙවෙනි පාඩමෙන් අපි තව ඉස්සරහට HTML ගැන කථා කරනවා.

ගියපාර නැවැත්තුවා <h1> - <h6> වලින්. මේ පාර පටන් ගන්නෙ පොඩි විශේෂ කාරනාවකින්
ඒ තමයි !DOCTYPE HTML විදියට සදහන් කරන දේ

මේ විදියට type කරපුවම browser ඒකට ලේසියි web page ඒක නිවැරදිව display කරන්න. ඒ විදියට කියන්න හේතුව web වල ඒක ඒක විදිහෙ document types තියෙනවානෙ.නිවැරදිව display කරන්න browser ඒක නිවැරදි document type ඒක වගේම version ඒකත් දැනගෙන ඉන්න ඔින.

HTML version 5 වලදි <!DOCTYPE HTML> විදියටත් version 4.1 වලදි <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> XHTML version 1.0 වලදි <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

මේක type වෙන්නෙ page ඒකේ උඩින්මයි.

ඊලග tag ඒක තමයි anchor tag ඒක. මේක code වෙන්නෙ <a></a> විදියට
ඒ කියන්නෙ <a href="http://www.google.com">GOOGLE</a> යන කොටස code කලාට පස්සෙ web page ඒක load වුනාට පස්සෙ පේන්නෙ GOOGLE විදියට. මේ වචනෙ උඩ click කරාට පස්සෙ ඔයාට ඒ ලින්කුවට අදාල පිටුවට යන්න පුලුවන්. මේකෙ href කියලා තියෙන්නෙ attribute ඒකක් tag ඒකේ. attribute පාවිච්චි වෙන්නෙ tag වැඩියෙන් විස්තර කරන්න ඔින වුනාම.

මීලගට අපි කියන්නෙ අලුත් tag ඒකක් ගැන. ඒ තමයි img tag ඒක.<img> tag ඒකේ විශේෂත්වෙ තමයි මේකට tag ඒක යුගල් විදියට නෙමෙයි තියෙන්නෙ. තනි tag ඒකක්.
<img src="image.jpg" alt= "google.com" width="104" length = "120"/>
මේකෙ attribute ගැන කථා කථා කලොත් src කියන්නෙ image ඒකට අදාල වෙන නම. alt කියන්නෙ alternative text කියන දේමයි. width කියන ඒකින් රූපයේ පළලත් length කියන ඒකින් රූපයේ දිගත් අදහස් වෙනවා...

br කියන tag ඒකත් තනි tag ඒකක්. <br/> වලින් තමයි ඒක පෙන්වන්නෙ. මේකට empty HTML element ඒකක් විදියටත් හදුන්වනවා.ඒ මේ tag ඒකට attribute මුකුත්ම නැති නිසා.
My name is Chamiya.<br/>I live in Sri lanka විදියට code කලොත්.web page ඒකේ

My name is Chamiya.
I live in Sri lanka.

විදියට තමයි ලැබෙන්නේ.

අපි ඊලග ලිපියෙන් තව ඉස්සරහට කථා කරමු web ගැන...

Saturday, December 19, 2015

WEB ඉගෙන ගනිමු - 1 පාඩම

කෝමද යාලුවනේ ටික කාලෙකට පස්සෙ අායෙත් වැඩ පටාාාාන් ගත්තා...
අද අපි පටන් ගන්නවා web ගැන ඉගෙන ගන්න.
මුලින්ම කථා කලොත් web site හදන්නෙ කොහොමද කියලා, අපිට ඔින වෙනවා HTML, CSS, Java Script, PHP , data base ඒකක් තියාගන්න ඔිනනම් SQL ඒහෙමත් ඔින වෙනවා.

මේවාගෙන් මුලින්ම ඔින වෙන්නෙ HTML.HTML කියන්නෙ Hyper Text Markup Language කියන දේමයි. HTML වලින් page ඒකක් හැදෙනවනම් මේ page ඒකේ තියෙන්නෙ ප්‍රධාන කොටස් 2යි. ඒ head ඒකයි body ඒකයි.
HTML type කරන්නෙත් විශේෂ විදියකට... ඒ තමයි <head> විදියට. වචනෙ දෙපැත්තෙන් "<" ">" කොටස් ඒනවා. Angle brackets කියන්නෙ මේවට තමයි.

අපි කථා කලොත් code කරන්නෙ කියලා මුලින්ම <html></html> කියන කොටස.
මේක අැතුලෙ තමයි අපේ code ඒක වදින්නෙ.
මුලින්ම කරන්නෙ head ඒකයි body ඒකයි දෙකම type කරගන්නවා.
<html>
<head></head>
<body></body>
</html>

මේක තමයි අපේ plan ඒක.
ඊට පස්සෙ වැඩේ පටන් ගන්නවා.

මුලින්ම කථා කරන්නෙ head ඒක ගැන.
head ඒකේ type වෙන්නෙ අපි web page ඒකේ address ඒකටත් උඩින් නම වගේ තියෙන කොටස.
<html>
<head>
<title>
Page ඒකේ title ඒක
</title>
</head>
<body>
</body>
</head>

මේ විදියට කඩලා type කරගත්තම අපි පටන් ගත්ත හැම tag ඒකක්ම ඉවර වුනාද කියලා පැහැදිලිව බලා ගන්න පුලුවන්.

ප්‍රධාන දෙවෙනි කොටස තමයි body ඒක.
body ඒකේ type වෙන දේවල් තමයි web page ඒකේ userට බලන්න පුලුවන් වෙන්නෙ.
body ඒකේ code වෙන ප්‍රධානම 2 තමයි <p> tag ඒකයි <h1>tag ඒකයි.
<p> tag ඒක පාවිච්චි වෙන්නෙ paragraphs type කරගෙන යද්දි.
<h1> tag ඒක ඔින වෙන්නෙ headlines type කරද්දි

මෙතනදි headline වල ප්‍රමාණ වෙනස් වෙද්දි පාවිච්චි වෙන tags මාරු වෙනවා.
<h1>Headline 1</h1>
<h2>Headline 2</h2>
<h3>Headline 3</h3>
<h4>Headline 4</h4>
<h5>Headline 5</h5>
<h6>Headline 6</h6>

Headline 1

Headline 2

Headline 3

Headline 4

Headline 5

අන්තිම පෝලිම මෙච්චර පොඩි නොවුනත් පිලිවෙලින් කුඩා වෙනවා.

අපි ඊලග ලිපියෙන් තව ඉස්සරහ පාඩම් ගැන කථා කරමුකෝ...

ලිපි වල අඩුපාඩු පෙන්වන යාලුවන්ට වගේම අලුත් මාතෘකා කථා කරන්න උනන්දු කරවන යාලුවන්ටත් බොහොම ස්තූතියි...

ඉස්සරහටත් අපි ඒකට වැඩ කරමු...

චමියගෙ I.T සටහන්

දැනට තිබෙන පාඩම්...