-->

HTML ( Lesson 3 )

Posted in
No comments
Sunday, August 4, 2013 By $U Y4T4N4R



အားလံုးပဲ..မဂၤလာပါ..။ မေတြ႔ရတာလည္းၾကာၿပီေနာ္..။ ညီမလည္း. android project တစ္ခုကုိ.. အၿမန္ေရးေနတာနဲ႔.. post ေတြမတင္ၿဖစ္လိုက္တာပါ..။ HTML ေတြလည္း.. မေမ့လိုက္ၾကနဲ႔ဦးေနာ္.. ^_^

Using Horizontal Rule <hr>
<html>
<head>
</head>
<body>
<h1 align="center"> Hello World </h1>
<hr>
</body>
</html>

- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "hrline.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. hrline.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။

- Horizontal line တားခ်င္ရင္.. <hr> ကုိသံုးလို႔႔ပါတယ္.။ 
- line ကိုလည္း.. အထူအပါး.. ၾကိဳက္သလိုထားလို႔ရပါတယ္...။ ေအာက္က.. attribute ကုိၾကည့္ၾကည့္ပါ။



Attribute of Horizontal Rule
<hr size=" "  align="  " width="  " noshade="noshade">

 Example
 <html>
<head>
</head>
<body>
<hr size=4 align="center" width=300 shade="noshade">
</body>
</html>


- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "hr.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. hr.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။

- <hr> မွာ size က.. horizontal လိုင္းရဲ႔..အထူပါ..။
- align="center" လို႔ေပးခဲ့လို႔.. အလယ္မွာေပၚေနပါမယ္.။
- width ကေတာ့.. line ရဲ႔ အရွည္ပါ..။ 
- shade="noshade" ဆိုတဲ့အတြက္.. line က.. ပထမတစ္ပုဒ္ကလိုင္းနဲ႔မတူပဲ.. shade မပါပဲ..ၿဖစ္ေနပါ့မယ္.။
- ဂဏန္းတန္ဖိုးေတြကုိ.. " " (double code) ထည့္မေရးလည္းရပါတယ္..။

Break line  <br>
<html>
<head>
</head>
<body>
Hello <br>
Hi <br>
Welcome <br>
</body>
</html>

- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "br.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. br.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။

- <br> ဆိုတာ...စာေတြကုိ..ေနာက္တစ္ေၾကာင္းဆင္းခ်င္ရင္.. <br> tag ကုိသံုးပါတယ္..။

 Using Blockquote
 <html>
<head>
</head>
<body>
<p> <blockquote> HTML is specialized language, designed to display and access web pages. The language consists of ordinary text and special commands called tags which are really HTML language commands.
</p></blockquote>
</body>
</html>

- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "blockquote.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. blockquote.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။

- blockquote ေတြကုိ.. paragraph အမ်ားစု <p> နဲ႔တြဲၿပီးသံုးပါတယ္...။ 
- paragraph ေတြကုိ.. သပ္သပ္ရပ္ရပ္ေပၚေပးႏိုင္ဖုိ႔ပါ..။

Using Background Color
<html>
<head>
</head>
<body bgcolor="red">
 My background is change.
</body>
</html>

- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "bgcolor.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. bgcolor.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။
 

- background color ကုိေၿပာင္းခ်င္ရင္.. bgcolor ကုိ.သံုးရပါတယ္.။
- bgcolor ကုိ.. body tag အတြင္းမွာသာ.. အသံုးၿပဳႏိုင္ပါတယ္.။
- color တန္ဖိုးေပးတဲ့ေနရာမွာ.. "red", "green" , "blue" ဆိုၿပီး. နာမည္သာမက.. ဂဏန္းတန္ဖုိးေတြပါ..ေပးလို႔ရပါတယ္.။
- eg... color="#ff0000" , color="red"
- ကိန္းဂဏန္းနဲ႔ေပးမယ္ဆုိရင္.. ေရွ႔ကေန  # ကုိ.ထည့္ေပးရပါတယ္.။  
- color code ေတြကုိ.. အလြတ္မရရင္.. Photoshop software မွာၾကည့္လုိ႔ရပါတယ္.။

Using Text Color 
<html>
<head>
</head>
<body text="yellow" bgcolor="black">
 Changing background and using text color.<br>
Text color is yellow.<br>
</body>
</html> 

- အေပၚက.. code ေတြကုိ.. NotePad++ ထဲ.. ခ်ေရးလိုက္ပါ..။
- ၿပီးရင္.. "txtcolor.html" ဆိုၿပီး save လုပ္လိုက္ပါမယ္.။
- Save လုပ္ထားတဲ့. txtcolor.html ကုိ..computer ထဲမွာၿပန္သြားရွာၿပီး.. ဖြင့္ၾကည့္လိုက္ပါ.။
 
 

- text color ကုိ. body ထဲမွာ. text=" " ဆိုၿပီးသံုးရပါတယ္..။
- <body> ထဲမွာေရးထားတ့ဲအတြက္.. <body> ... </body> အတြင္းက..စာအားလံုးနဲ႔သက္ဆုိင္ပါတယ္..။ စာအားလံုး. အ၀ါေ၇ာင္ၿဖစ္သြားပါလိမ့္မယ္..။

ဒီေန႔ေတာ့.. horizontal line, break line နဲ႔.. color ေၿပာင္းတာေတြ.ေၿပာခဲ့တယ္ေနာ္..။ အားလံုးပဲ.. လုပ္လို႔အဆင္ေၿပလိမ့္မယ္လုိ႔...ထင္ပါတယ္..။ ဘယ္လိုမ်ိဳးေပၚလာလဲဆိုတာကိုေတာ့.. ကိုယ့္ဘာသာကုိယ္.စမ္းၾကည့္လိုက္ၾကေနာ္...။ ေနာက္ေန႔ဆက္ေရးမယ့္.. သင္ခန္းစာေတြကုိလည္း. အားေပးၾကပါဦးေနာ္.... ^_^

Related posts

0 ေယာက္ Comment ေပးသြားတယ္:

ေဒါင္းနည္းမသိပါကအရင္ဖတ္ပါ

Download Link ကုိႏွိပ္ၿပီးလွ်င္ 5စကၠန္႔ေစာင့္ပါ၊ ၿပီးလွ်င္ ညာဘက္အေပၚေဒါင့္မွ Skip ကုိႏွိပ္ေပးမွသာ Download Page သုိ႔ ေရာက္႐ွိမည္ျဖစ္သည္။

Proudly Powered by Blogger.