CSS နဲ့ iframe Style လုပ်နည်း

iframe က်ဘ်ဆိုက်ဒီဇိုင်းအတွက်မည်သို့အလုပ်လုပ်ပုံကိုနားလည်သဘောပေါက်ခြင်း

သင်သည်သင်၏တစ်ခုဒြပ်စင်တွေကို embed တဲ့အခါမှာ က HTML , သင်ထည့်သွင်းဖို့နှစ်ခုအခွင့်အလမ်းများရှိ CSS ကိုစတိုင်များ က:

အဆိုပါ iframe Element ကို Style ဖို့ CSS ကိုအသုံးပြုခြင်း

သင့်ရဲ့ iframes styling အခါသင်စဉ်းစားသင့်ပထမဦးဆုံးအရာ iframe သူ့ဟာသူဖြစ်ပါတယ်။ အများဆုံး browser များအပိုစတိုင်များအများကြီးမပါဘဲ iframes ပါဝင်သည်နေစဉ်, ကတသမတ်တည်းသူတို့ကိုစောင့်ရှောက်ရန်အချို့သောစတိုင်များကိုထည့်သွင်းဖို့နေဆဲကောင်းတစ်စိတ်ကူးပါတယ်။

ဤတွင်အစဉ်မပြတ်ငါငါ့အ iframes အပေါ်ပါဝင်သည်အချို့ CSS ကိုစတိုင်များနေသောခေါင်းစဉ်:

ငါ၏အစာရွက်စာတမ်းအတွက်ကိုက်ညီသောအရွယ်အစားကိုသတ်မှတ် width နဲ့ height အတူ။ ဤတွင်မျှမစတိုင်များနှင့် style အမျိုးမျိုးပဲအခြေခံနှင့်တသားတနဲ့ frame ရဲ့ဥပမာဖြစ်ကြသည်။ သင်တို့ကိုတွေ့မြင်နိုင်သကဲ့သို့ဤစတိုင်များအများစုရုံ iframe န်းကျင်ကနယ်စပ်ကိုဖယ်ရှား, ဒါပေမဲ့သူတို့မှာလည်း browser အားလုံးအတူတူပင်မာဂျင်, padding ကိုနှင့်ရှုထောင့်နဲ့ iframe ဖော်ပြရန်ကြောင်းအာမခံပါသည်။

HTML5 ကို သင်စာစောင်ကိုအရက်ဆိုင်ဖယ်ရှားရန်လျတ် property ကိုသုံးကြောင်းအကြံပြုဒါပေမယ့်ယုံကြည်စိတ်ချရသောမဟုတ်ပါဘူး။ သင်စာစောင်ကိုအရက်ဆိုင်ကိုဖယ်ရှားသို့မဟုတ်ပြောင်းလဲပစ်ချင်တယ်ဆိုရင်ဒါကြောင့်သင်ကဲ့သို့ကောင်းစွာသင့်ရဲ့ iframe အပေါ် scrolling မ attribute ကိုအသုံးပြုသင့်ပါတယ်။ အဆိုပါ scrolling attribute ကိုသုံးဖို့ဆိုအခြား attribute ကိုနဲ့တူပါက add ပြီးတော့သုံးတန်ဖိုးများတွေထဲကရွေးချယ်ဖို့: ဟုတ်ကဲ့မရှိ, သို့မဟုတ်အလိုအလျောက်။ ဟုတ်ကဲ့အစဉ်အမြဲသူတို့လိုအပ်ကြသည်မဟုတ်ရင်တောင်စာစောင်ကိုအရက်ဆိုင်များပါဝင်သည်ဖို့ browser ကိုပြောပြသည်။ လိုအပ်ဖြစ်စေမအားလုံးစာစောင်ကိုအရက်ဆိုင်ဖယ်ရှားပစ်ရန်ပြောပါတယ်မျှ။

အော်တိုကို default ဖြစ်ပြီးသူတို့လိုအပ်သည့်အခါစာလိပ်အရက်ဆိုင်များပါဝင်သည်ကိုသူတို့မရကြသောအခါထိုသူတို့ဖယ်ရှားပေးပါသည်။

ဤတွင် scrolling မ attribute ကိုအတူ scrolling ကို turn off ဖို့ဘယ်လိုဖြစ်ပါသည်:

ဒီ
= "no" ဆိုတဲ့ > scrolling တစ်ခု iframe ဖြစ်ပါတယ်။

HTML5 ကိုအတွက် scrolling ကို turn off ဖို့သင်လျတ် property ကိုသုံးလို့ယူဆတယ်နေကြသည်။ ဒါပေမယ့်သင်၌တွေ့နိုင်ပါသည်အဖြစ် ဤဥပမာ ကသေး browser အားလုံးအတွက်ယုံကြည်စိတ်ချရသောအလုပ်မလုပ်ပါဘူး။

ဒီနေရာတွင်လျှံစီးပိုင်ဆိုင်မှုနှင့်အတူလူအပေါင်းတို့သည်အချိန် scrolling ကိုဖွင့်မယ်လို့ကိုဘယ်လိုဖွင့်:

စတိုင် = "လျတ်: scroll;" > ဒီ
တစ်ခု iframe ဖြစ်ပါတယ်

လျှံစီးပိုင်ဆိုင်မှုနှင့်အတူလုံးဝ scrolling မကို turn off မရှိလမ်းလည်းမရှိ။

အတော်များများကဒီဇိုင်နာများစာဖတ်သူများ iframes ပင်ရှိတယ်ဆိုတာကိုသိရပါဘူးဒါကြောင့်သူတို့ရဲ့ iframes သူတို့အပေါ်များမှာစာမျက်နှာ၏နောက်ခံနဲ့ရောနှောနေခြင်းချင်တယ်။ သို့သော်သင်သည်လည်းထိုသူတို့ထွက်မတ်တပ်ရပ်စေစတိုင်များထည့်သွင်းနိုင်ပါတယ်။ အဆိုပါ iframe ပိုပြီးအလွယ်တကူဖွင့်ပြသနိုင်အောင်နယ်စပ်ချိန်ညှိလွယ်ကူပါတယ်။ ရုံနယ်နိမိတ် style ဖို့ (သို့မဟုတ်ကြောင့်နယ်စပ်-ထိပ်, နယ်စပ်ညာ, နယ်စပ်-left နှင့်နယ်စပ်-အောက်ခြေဂုဏ်သတ္တိများနှင့်ဆက်စပ်သောရဲ့) ကိုနယ်စပ်စတိုင် property ကိုသုံး:

iframe {
နယ်စပ်-top: dotted # c00 1px;
နယ်စပ်ညာ: # c00 2px dotted;
နယ်စပ်-left: # c00 2px dotted;
နယ်စပ်-အောက်ခြေ: # c00 4px dotted;
}

သို့သော်သင်သည်သင်၏စတိုင်များများအတွက် scrolling မနှင့်နယ်နိမိတ်နှင့်အတူရပ်တန့်မပေးသင့်ပါတယ်။ သင်သည်သင်၏ iframe အခြား CSS ကိုစတိုင်များအများကြီးလျှောက်ထားနိုင်ပါသည်။ ဒါကဥပမာ iframe တစ်ဦးအရိပ်ပေးရ CSS3 စတိုင်များကိုအသုံးပြုသည်, ထောင့်ဝိုင်းနှင့် 20 ဒီဂရီလှည့်။

iframe {
margin-top: 20px;
margin-အောက်ခြေ: 30px;

-moz-border-အချင်းဝက်: 12px;
-webkit-border-အချင်းဝက်: 12px;
နယ်စပ်-အချင်းဝက်: 12px;

-moz-box ကို-အရိပ်: 4px 4px 14px # 000;
-webkit-box ကို-အရိပ်: 4px 4px 14px # 000;
သေတ္တာ-အရိပ်: 4px 4px 14px # 000;

-moz-transform: လှည့် (20deg);
-webkit-transform: လှည့် (20deg);
-O-transform: လှည့် (20deg);
-ms-transform: လှည့် (20deg);
filter ကို: progid: DXImageTransform.Microsoft.BasicImage (လည်ပတ် = .2);
}

အဆိုပါ iframe မာတိကာ Styling

တစ်ဦး iframe ရဲ့ contents Styling ရုံကိုအခြားဝဘ်စာမျက်နှာ styling ကဲ့သို့ဖြစ်၏။ ဒါပေမယ့်သင်ကစာမျက်နှာကိုတည်းဖြတ်ရန်လက်လှမ်းရှိရမည်။ သင်စာမျက်နှာကိုတည်းဖြတ်မရနိုင်ပါ အကယ်. (ဥပမာ, ကအခြား site ပေါ်တွင်ဖွင့်) ။

သငျသညျစာမျက်နှာတည်းဖြတ်နိုင်သည်လျှင်, သင်တစ်ဦး add နိုင်ပါတယ် external style sheet သို့မဟုတ် ညာဘက်စာရွက်စာတမ်းအတွက်စတိုင်များ သင်သည်သင်၏ site ပေါ်တွင်မဆိုအခြားဝဘ်စာမျက်နှာ style မယ်လို့လိုပဲ။