11

XXXX

...
widget

Sunday, September 29, 2013

ေဘာင္ေလးေတြနဲ႕ စာေရးခ်င္ရင္

ခုေဖာ္ျပမယ့္ဟာေလးေတြကေတာ့ ရိုးရိုး Scroll Box ထက္နည္းနည္းေလး ထူးျခားျပီး ၾကည့္လို႔ ေကာင္းမယ့္ Box ကေလးေတြပါ။
အားလံုးေပါင္း (၇) ခုရွိပါတယ္။ ဘယ္လိုသံုးရသလဲဆိုေတာ့ ပံုနဲ႔တြဲျပထားတဲ့ Code ေတြကို ကူးျပီး ေရးခ်င္တဲ့ေနရာမွာထား
ကိုယ္ေရးခ်င္တဲ့စာသားေတြ ..... ဆိုတဲ့ေနရာမွာ ကိုယ္ေရးမယ့္စာေတြကူးထည့္လိုက္.

.။ ဒါဆိုရင္ေတာ့ ဆန္းျပားတဲ့ကိုယ့္ရဲ ႔စာေလးေတြရပါလိမ့္မယ္။

ဆန္းလဲဆန္း ...လွလဲလွ ...ေနရာယူလည္းသက္သာလွတဲ့ ေဟာသည့္ box ကေလးေတြကို ယူသံုးခ်င္ရင္
ကုဒ္ေတြ ယူပါေလေရာ့ ..............

နည္းလမ္း(၁)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px solid
#60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၂)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px dotted #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၃)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px dashed #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၄)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px groove #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၅)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px double #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၆)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px ridge #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

နည္းလမ္း(၇)

ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....

<div style="height:120px;width:250px;overflow:scroll;border:9px inset #60D6F3;">ကိုယ္ေရးခ်င္တဲ့စာသားေတြ .....</div>

ကြ်န္ေတာ္ အနီေရာင္ျပထားတဲ့စာသားေတြေနရာမွာ ကိုယ္ၾကိဳက္တာေတြေရးႏိုင္သလိုပါပဲ...
အနီေရာင္ျပထားတဲ့ ဂဏန္းေတြကလည္း ကိုယ္ၾကိဳက္ရာထည့္ျပီး ၾကိဳက္ရာအရြယ္သံုးႏိုင္ပါတယ္။

HTML ျဖင့္ေဘာင္ခတ္ျခင္း


နည္းပညာသမုဒၵရာၾကီးထဲကေရစက္ေလးတစ္ေပါက္စာေလာက္ပါ
ကြ်န္ေတာ္ဒီပို႔စ္ကိုေရးတာ web page ကိုအခုမွစတင္ေလ့လာျပီး
အခက္အခဲရွိေနသူမ်ားအတြက္ပါ ။ကိုယ္တိုင္တတ္လြန္းလို႔ေရးတာမဟုတ္ပဲ
သိထားသေလာက္ေလးကိုျပန္မွ်ေ၀တဲ့သေဘာပါ ။
တစ္ခုခုလိုအပ္တာ/ မွားယြင္းတာေတြ႕ခဲ့ရင္ ပညာရွင္မ်ားကေ၀ဖန္ျပင္ဆင္ေပးၾကပါခင္ဗ်ာ ။

======================================================


ဒီတစ္ခါေတာ့ html ကိုသံုးျပီးမိမိရဲ႕စာေတြကိုေဘာင္ေလးခတ္အလွဆင္ဖို႕ပါ..။


<div style="border: 7px ridge rgb(255,51,153);">ၾကံဳတိုင္းရြ</div>


<div style="border: 7px ridge rgb(0,204,153);">ၾကံဳတိုင္းရြာ
</div>


<div style="border:7px ridge rgb(0,0,255);">ၾကံဳတိုင္းရြာ</div>


<div style="border: 7px ridge rgb(255,255,0);">ၾကံဳတိုင္းရြာ</div>


<div style="border: 7px ridge rgb(246, 53, 9);">ၾကံဳတိုင္းရြာ</div>


<div style="border: 7px ridge rgb(246, 171, 9);">ၾကံဳတိုင္းရြာ</div>


ကြ်န္ေတာ္အေပၚမွာေရးခဲ့တဲ့ကုဒ္ေတြက အခုလိုေတြ႕ရပါမယ္.......

ၾကံဳတိုင္းရြာ
ၾကံဳတိုင္းရြာ
ၾကံဳတိုင္းရြာ
ၾကံဳတိုင္းရြာ
ၾကံဳတိုင္းရြာ
ၾကံဳတိုင္းရြာ

အနီေရာင္နဲ႔ျပထားတဲ့ေနရာမွာ ႏွစ္သက္ရာစာသားထည့္ ၊အျပာေရာင္နဲ႔ျပထားတဲ့ေနရာက
rgb color code ေတြပါ..ႏွစ္သက္ရာထည့္ေပါ့ ၊ 7px ဆိုတာကေဘာင္ရဲ႕အထူအပါးေလ..
စိတ္ၾကိဳက္ေျပာင္းထည့္ေပါ့....
( rgb color code ေတြကဒီမွာခင္ဗ်...http://www.html-color-codes.com/rgb.html )

============================

ေနာက္ထပ္ေဘာင္ေလးေတြပါ

ကြ်န္ေတာ္ကဒီလိုကုဒ္ေလးေတြေရးလိုက္တယ္ဗ်ာ...
ဘယ္လိုပံုေပၚလာသလဲဆိုတာပါထည့္ေပးလိုက္ပါတယ္
..............................................................................................
ဒါက solid ေဘာင္ေလးဗ်ာ

<div style="width:200px;height:50px;border:3px solid blue;">
က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္
</div>
က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္


...................................................................................................
ဒါေလးမိုက္တယ္ဗ်..ႏွစ္ထပ္ေဘာင္ေလးေလ...


<div style="border: 7px double red; width:350px; height: 350px;">
က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္</div>



က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္

...................................................................................................
ဒီတစ္ခုကပံုစံေလး ၃ မ်ိဳးေရာထားတာဗ်


<div style="border-style: dotted dashed solid double; border-color: green; border-width: 9px; width: 300px; height: 100px;">
က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္ </div>



က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္

.............................................................................................................
သေဘာက်စရာပံုစံအဆန္းေလးဗ်...


<div style="border: 7px inset blue; width: 200px; height: 100px;">
က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္ </div>


က်ံဳတိုင္းရြာမွ ၾကိဳဆိုပါတယ္

..............................................................................................................

အျပာေရာင္ေနရာေတြကစိတ္ၾကိဳက္္ေျပာင္း၊အစိမ္းေရာင္ေနရာကၾကိဳက္တဲ
အေရာင္ေျပာင္းေပါ့...



အားလံုးအဆင္ေျပႏိုင္ၾကပါေစ....


ဆက္ပါဦးမယ္ခင္ဗ်ာ..
===========================
 
 

1 comment:

1111