HTML #2

html code කරන්න  text editor එකක් ඕනි,ඒ  වගේම හදන වෙබ් පිටු බලන්න web browser එකක් ඕනි . windows බාවිතා කරන අයට notepad එක බාවිතා කරන්න පුළුවන්.notepad++,komodo edit,brackets වගේ intelligent text editors බාවිතා කරන්න පුළුවන්,web browser එක chrome,firefox,safari වඩා හොදයි.

හැම වෙබ් පිටුවක්ම හැදිලා තියෙන්නේ tags වලින්..උදාහරණයක් විදිහට image එකක් දාන්න ඕනනම් අපිට image tag එකක් ඕනි ,title එකකට title tag එකක් ඕනි,link එකකට link tag එකක් ඕනි,මේ විදිහට tags ගොඩක එකතුවක් තමා web page එකක් වෙන්නේ.මූලිකව  ටැග් එකක් ලියන්නේ මෙහෙමෙ

<tag name> (less than + tag name + greater than)

උදාහරණ – <img> image එකකට යොදන tag එක

<p> paragraph එකකට  යොදන tag එක

මුලින්ම html එකක් පටන් ගන්නේ විශේෂිත tag එකකින්,

<! doctype html> මේ tag එකෙන් තමා පටන් ගන්නේ (මේ tag  පිළිබද වැඩිදුර තොරතුරු පසුවට )

මූලිකව web page එකක් පටන්ගන්නේ html tag එකෙන් ..

<html> html tag එකේ ආරම්භය

</html> html tag එකේ අවසානය

මේ tags දෙක අතර තියෙන හැම දෙයක්ම html tag එකට  අයිතියි.ඒ කියන්නේ web page එකේ display වෙන්න අවශ්‍ය හැම දෙයක්ම මේ tags මැද තියෙන්න ඕනි.

වෙබ් පිටුවක් කොටස් දෙකකින් සමන්විතයි.

1.head- web browser එකට අදාළ සියලුම තොරතුරු,key words,වෙබ් පිටුවේ title එක වගේ තොරතුරු

2.body- වෙබ් පිටුවේ පෙනෙන තොරතුරු (images,text,links වගේ දේවල්)

වෙබ් පිටුවට title එකක් එකතු කරන්න අවශ්‍යනම් දැන් අපිට head tag එකක් අවශ්‍ය වෙන්වා,ඒක වෙබ් පිටුව ඇතුලේ තියෙන නිසා html tag අතර තියෙන්න ඕනි..head tag එක එකතු කරන්නේ මෙහෙම.

<head>

</head>

title එක එකතු කරන්න title tag එකක් ඕනි.ඒ title එක head එකේ තියෙන නිසා head tags ඇතුලේ title tags තියෙන්න ඕනි.

 

<!doctype html>

<html>

<head>

<title> අවශ්‍ය title එක </title>

</head>

</html>

ඊළගට අපි body එක හදමු..body එක සහ head එක දෙකක් කියලා අපි දන්නවා,ඒ නිසා body tag එක head tag එක ඇතුලේ තියෙන්න බැ,ඒ  වගේම body එක කියන්නේ අපේ වෙබ් පිටුවේ display වෙන්න ඕන දෙයක්,ඒ කියන්නේ  html tags ඇතුලේ තියෙන්න ඕනි..

<!doctype html>

<html>

<head>

<title> අවශ්‍ය title එක </title>

</head>

<body>

body එකේ තියෙන්න ඕන දේ ..

</ body>

</ html>

ඊළගට වැදගත්ම දේ..මේ විදිහට හදාගත්ත file එක අපි හරියට save කරගන්න ඕනි..අපි හදන්නේ html files නිසා extension එක html වෙන්න ඕනි.

Screenshot_3

මෙහෙම save කරාම default browser එකේ icon එකෙන් file එක save වෙනවා..එක double click කරලා හදපු web page එක බලන්න පුළුවන්.

Screenshot_6

 

 

Screenshot_5

 

 

 

 

 

 

 

 

 

 

 

වැදගත් දේවල් ටිකක් – tag එකක් open කරාම අනිවාර්යයෙන් tag එක close කරන්න.

– code කරන්න කලින් html විදිහට file එක save කරලා code කරන්න පටන්                                     ගන්න,එකෙන් සිදුවෙන වැරදි ගොඩක් අඩුවෙනවා..(text editors වල                                                suggestions නිසා )

වැදගත් tags සහ Styles ඊලග post එකේ ඉදන්…

රණරජ මාතාවට ජය !!!!

Advertisements

3 thoughts on “HTML #2

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s