Tuesday, July 9, 2013

HTML Chapter 2_How to write HTML Web page

HTML document တစ္ခုကို ေရးသား ရာတြင္....

  1. <!DOCTYPE> ကို အရင္ဆံုးေရးရပါတယ္။
  2. <html> start tag ႏွင့္ </html> end tag တို. ပါရွိရပါမယ္။
  3. <html> ႏွင့္ </html> အတြင္းတြင္ <head> tag ႏွင့္<body> tag တို.ကိုေရးရပါတယ္။

1. The <!DOCTYPE> Declaration

HTML language ျဖင့္ ေရးထားေသာ document တစ္ခု၏ Type ႏွင့္ Version ကို Browser ကသိမွာသာ Web page အျဖစ္ မွန္ကန္စြာ ေဖာ္ျပေပးႏိုင္မွာ ျဖစ္ပါတယ္။ ထို.ေၾကာင့္ မိမိ အသံုးျပဳေရးသားေသာ HTML version အမ်ိဳးအစာ ကို <!DOCTYPE> ျဖင့္ ဦစြာ declaration လုပ္ရျခင္း ျဖစ္ပါတယ္။ ဥပမာ HTML 5 ကိုအသံုးျပဳျပီး ေရးသားလိုပါက <!DOCTYPE html> ကို HTML document တြင္ စေရး ရပါတယ္။ HTML common declarations မ်ားမွာ...

HTML 5

<!DOCTYPE html>


HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">


XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


2. The <html> tag

<html> tag သည္ Hyper Text Markup Language ျဖစ္ေၾကာင္း declaration လုပ္ေပးျခင္း ျဖစ္ပါတယ္။ ထို.ေၾကာင့္ အျခားေသာ HTML ၏ tags မ်ားကို <html> ႏွင့္ </html> အတြင္းတြင္ ေရးသားရျခင္းျဖစ္ပါတယ္။


3. The <head> tag and the <body> tag

The <head> tag

<head> tag သည္ <title>, <style>, <meta>, <link>, <script>, etc... စသည့္ elements မ်ားကို ေရးသားဖို.အတြက္ section တစ္ခု ျဖစ္ပါတယ္။
  • The <title> tag : Browser ၏ toolbar မွာ Title name အျဖစ္ ေဖာ္ျပေပးျခင္း၊
  • The <style> tag : CSS, Javascript, Jquery တို.အတြက္ေရးျခင္း၊
  • The <meta> tag : Search engine မွ ရွာေဖြရလြယ္ကူေအာင္ လုပ္ေဆာင္ေပးျခင္း၊
  • The <link> tag : Stylesheet (CSS) တို.ႏွင့္ ခ်ိတ္ဆက္အသံုးျပဳျခင္း တို.ျဖစ္ပါတယ္။

The <body> tag

<body> tag က web page ေပၚတြင္ contents မ်ားကို ျမင္ေတြ.ႏိုင္ေအာင္ လုပ္ေဆာင္ေပးပါတယ္။ ထို.ေၾကာင့္ Web page တြင္ ေဖာ္ျပလိုေသာ အေၾကာင္း အရာမ်ား အတြက္ <body> ႏွင့္ </body> အတြင္းတြင္ ေရးသားရပါတယ္။ Web pages မ်ား တြင္ အေၾကာင္း အရာမ်ား ကို Paragraph, Photo, ... စသည္ျဖင့္ေဖာ္ျပေလ့ ရွိတာေၾကာင့္ Usage Tags မ်ားကို စျပီးေလ့ လာၾကည့္ပါမယ္...
  • Heading _ Heading အတြက္ေတာ့ <h1> tag မွစျပီး <h6> tag အထိ အစဥ္လိုက္ရွိပါတယ္။ အစဥ္ေျပသလို အသံုးျပဳႏိုင္ပါတယ္။
  • Paragraph _ Paragraph မ်ားအတြက္ <p> tag ကိုအသံုးျပဳျပီး ေရးရပါတယ္။
  • Bold _ <b> tag ကိုသံုးျပီး စာလံုးကို ထင္ရွားေအာင္ လုပ္ေပးႏိုင္ပါတယ္။
  • Important text _ <strong> tag ကို သံုးျပီး အေရးၾကီးေၾကာင္း ျပဆိုႏိုင္ပါတယ္။ <b> tag ကဲ့သို. Bold လုပ္ေပးပါတယ္။
  • Italic _ <i> tag ကိုသံုးျပီး စာလံုးကို တေစာင္း အေနအထား ျဖင့္ ျပေပးႏိုင္ပါတယ္။
  • Emphasized text _ <em> tag သည္ italic ကဲ့သို.ပင္ လုပ္ေဆာင္ေပးပါတယ္။
  • Subscript _ <sub></sub> tag ကို သံုးျပီး စာကို ေအာက္သို.နိမ့္၍ ေဖာ္ျပ ေပးႏိုင္ ပါတယ္။
  • Superscript _ <sup></sup> tag ကို သံုးျပီး စာကို အေပၚသို.ျမင့္ ျပီးေဖာ္ျပ ေပးႏိုင္ပါတယ္။
  • Horizontal line _ <hr> tag ကို အသံုးျပဳရျပီး ၄င္းတြင္ end tag </hr> မရွိပါဘူး။ ဥပမာ syntax တစ္ခုျပီလို. Line နဲ.ပိတ္ခ်င္ပါက <hr> tag ကိုအသံုးျပဳ လို.ရပါတယ္။ 
အထက္ပါတို.ကိုေလ့လာျပီးပါက Chapter 3 မွာ HTML page တစ္ခု ကိုလက္ေတြ. ေရးၾကည့္ပါမယ္။

No comments:

Post a Comment