Basic HTML (3)

                                               Basic HTML                     
                                                    Lesson (3)
                                                   ===========

ဒီသင်ခန်းစာမှာ စာလုံး အရောင် ၊အမျိုးအစား၊ အရွယ်အစား ၊တို့ကိုဖော်ပြမဲ့

html code ရေးနည်းကိုဖော်ပြပါမည်။

                                              HTML Styles                 

The HTML Style Attribute

The HTML style attribute has the following syntax:

style="property:value"

(i)  HTML Text Color

စာလုံး(Text) အရောင်အတွက် color property ကိုအသုံးပြုရပါမယ်။

The color property defines the text color to be used for an HTML element:

Example

<h3 style="color:blue">(i) ‌ခေါင်းစဉ်ရဲ့စာလုံးအရောင် သည်အပြာရောင်ဖြစ်သည်။</h3>
<p style="color:red">(ii)စာပိုဒ်ရှိစာလုံးများ၏အရောင်သည် အနီရောင်ဖြစ်သည်။</p>

                   Result တွင် စာလုံးအရောင်ကိုသတိပြုပါ။

(i)ခေါင်းစဉ်ရဲ့စာလုံးအရောင်  သည်အပြာရောင်ဖြစ်သည်။

(ii)စာပိုဒ်ရှိစာလုံးများ၏အရောင်သည် အနီရောင်ဖြစ်သည်။

ဒီနေရာမှာ html style မှာရေးတဲ့ ကာလာမှာ u မပါဘူးနော။

color: ဆိုတာသတိပြုပါ။

ကျန်တဲ့အရောင် များကိုလည်းထည့်ကြည့်ပါ။

ခရမ်းရောင်၊အပြာနု(lightblue)၊အစိမ်းရောင်၊အစိမ်းနု(lightgreen) .....

စသည်ဖြင့်ပြောင်းထည့်ကြည့်ပါ။

- အရောင်စပ်များကိုတော့ RGB (or) Hexa  code များနဲ့သာ အဆင်ပြေပါတယ်။

 အဲဒီCode တွေကို Photoshop မှာလေ့လာလို့ရပါတယ်။

ဒီနေရာမှာလည်း လေ့လာနိုင်ပါတယ်။

http://www.w3schools.com/tags/ref_colorpicker.asp

http://www.pagetutor.com/common/bgcolors1536.html

http://www.colorsift.com/

Colour code များလေ့လာရန်အောက်ကအနီရောင်ခလုတ်ကိုနှိပ်ပါ

(ii) HTML Fonts

စာလုံး(Text) ပုံစံ အတွက် font-family property ကိုအသုံးပြုရပါမယ်။

The font-family property defines the font to be used for an HTML element:
Example

<h3 style="font-family:verdana">(i) ခေါင်းစဉ်၏ စာလုံးအမျိုးအစားသည် verdana ဖြစ်သည်။</h13>
<p style="font-family:courier">(ii)ဤစာပိုဒ်အတွင်းရှိစာလုံးအမျိုးအစားသည် courier ဖြစ်သည်။</p>

                        Result တွင် စာလုံးအမျိုးအစား ကိုသတိပြုပါ။

(i)ခေါင်းစဉ်၏ အမျိုးအစားသည် verdana ဖြစ်သည်။

(ii)ဤစာပိုဒ်အတွင်းရှိစာလုံးအမျိုးအစားသည် courier ဖြစ်သည်။

အခြားစာလုံးအမျိုးအစားများ Arial , Book Antiqua , Cambria , Cataneo BT ,

Century Gothic, Comic Sans MS ,Zawgyi-One

တို့ပြောင်းထည့် ပြီး Run ကြည့်ပါ။

(iii) HTML Text Size

စာလုံးအရွယ်အစားအတွက်  font-size property ကိုအသုံးပြုပါမည်။

value အတွက် % သို့မဟုတ် px ကိုအသုံးပြုပါမည်။

The font-size property defines the text size to be used for an HTML element:

Example

<h1 style="font-size:100%">(i)စာလုံးအရွယ်အစား 100% ဖြစ်သည်။</h1>
<p style="font-size:16px">(ii)(ii)စာလုံးအရွယ်အစား 16px ဖြစ်သည်။။</p>

Result

(i)စာလုံးအရွယ်အစား 100% ဖြစ်သည်။

(ii)စာလုံးအရွယ်အစား 16px ဖြစ်သည်။

အထူးမှတ်ရန် -

style property များကို ပေါင်းစပ်ရေးမည်ဆိုလျှင် property တစ်ခုနှင့်တစ်ခုအကြားတွင် “ ; ” ကိုခြားပေးရမည်။

ဥပမာကြည့်ရအောင်-
Example

<h3 style="font-size:16px;color:red;font-family:verdana">(i)This is a heading</h3>
<p style="font-size:32px;color:lightgreen;font-family:Arial ">(ii)This is a paragraph.</p>
<p style="font-size:14px;color:green;font-family:Comic Sans MS">(iii)This is a paragraph.</p>
<p style="font-size:20px;color:blue;font-family:Cataneo BT ">(iv)This is a paragraph.</p>
<p style="font-size:24px;color:violet;font-family:Comic Sans MS">(v)This is a paragraph.</p>

Result တွင် စာလုံးအရောင်၊ အမျိုးအစား နှင့် အရွယ်အစားတို့ကိုသတိပြုပါ။

(i)This is a heading

(ii)This is a paragraph.

(iii)This is a paragraph.

(iv)This is a paragraph.

(v)This is a paragraph.

The HTML Style Attribute များကိုဆက်လက်ဖော်ပြပါမည်။

ဦးအေးမင်း(အောင်မြေ)