css_15

CSS Padding

 Element တစ္ခုရဲ့ border နဲ႔ Content ၾကားက အစိတ္အပိုင္းကို အဲ့ဒီ့ Element ရဲ့ Padding လို႔သတ္မွတ္ပါတယ္၊ Padding ေတြက Element တစ္ခုရဲ့ background အေရာင္ ရ့ဲ သတ္ေရာက္ျခင္းကိုလဲ ခံရပါတယ္၊ ေျပာခ်င္တာက background အေရာင္ျခယ္လိုက္ရင္ Padding ကိုပါ အေရာင္ျခယ္ျပီးသားျဖစ္သြားမယ္၊ အေပၚ ေအာက္ ညာ ဘယ္ စတဲ့ Padding ေတြအားလံုးကို ၾကိဳက္ရာ Properties သံုးျပီး ေျပာင္းလဲႏိုင္ပါတယ္၊ အတိုေကာက္ေရးနည္းကိုလဲ အသံုးျပဳႏိုင္ပါတယ္၊

Padding - Individual sides

In CSS, it is possible to specify different padding for different sides: Padding ေလးဖက္လံုးကို ၾကိဳက္ရာ အရြယ္အစားသတ္မွတ္ႏိုင္တယ္၊ ေအာက္မွာဥပမာ ၾကည့္ပါ၊

Example

padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;

အထက္က ေရးထားတာက အေပၚ padding ကို 25 pxiel ထားမယ္၊ ေအာက္ padding ကို 25 pxiel ထားမယ္၊ ညာဘက္ padding ကို 50 pxiel ထားမယ္၊ ဘယ္ဘက္ padding ကို 50 pxiel ထားမယ္၊

Padding - Shorthand property

Padding ေတြကို အတိုေကာက္ေရးလို႔ရတယ္၊ ေအာက္မွဥပမာ ၾကည့္၊

• padding:25px 50px 75px 100px;

အထက္မွာေရးထားတာက အေပၚ padding 25px, ညာဘက္ padding 50px  ေအာက္ဖက္ padding 75px ဘယ္ဘက္ padding 100 px လို႔ေလးဖက္လံုးကိုအတိုေကာက္ေရးထားတာပါ၊

• padding:25px 50px 75px;

အထက္မွာေရးထားတာက အေပၚ padding 25px ညာဘက္နဲ႔ ဘယ္ဘက္ padding 50px ေအာက္ဖက္ padding 75px လို႔ ေရးထားတာ

• padding:25px 50px;

အထက္မွာေရးထားတာက အေပၚ နဲ႔ ေအာက္ padding 25px ညာဘက္နဲ႔ ဘယ္ဘက္ padding 50px  လို႔ ေရးထားတာ

• padding:25px;

အထက္မွာေရးထားတာက အေပၚ နဲ႔ ေအာက္ ညာ နဲ႔ ဘယ္ဘက္ padding 25px  လို႔ ေရးထားတာ လို႔ သတ္မွတ္ထားတာ၊

All CSS Padding Properties

Property	Description
padding	Declaration တစ္ခုထဲမွာ Padding properties ေတြအားလံုးကိုသတ္မွတ္ရန္
padding-bottom	Element တစ္ခုရဲ့ ေအာက္ပိုင္း Padding ကိုသတ္မွတ္ရန္သံုး
padding-left	Element တစ္ခုရဲ့ ဘယ္ဘက္ပိုင္း Padding ကိုသတ္မွတ္ရန္သံုး
padding-right	Element တစ္ခုရဲ့ ညာဘက္ပိုင္း Padding ကိုသတ္မွတ္ရန္သံုး
padding-top	Element တစ္ခုရဲ့ အေပၚပိုင္း Padding ကိုသတ္မွတ္ရန္သံုး