CSS : focus Selector
ဥပမာ
အာရုံစူးစိုက်မှုရလာသောအခါ ထည့်သွင်းသည့်အကွက်ကို ရွေးချယ်ပြီး ပုံစံသတ်မှတ်ပါ-
input:focus
{
background-color: yellow;
}
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
အာရုံ :focus
စူးစိုက်မှုရှိသော အစိတ်အပိုင်းကို ရွေးချယ်ရန်အတွက် ရွေးချယ်ကိရိယာကို အသုံးပြုသည်။
အကြံပြုချက်- :focus ရွေးချယ်မှုအား ကီးဘုတ်ဖြစ်ရပ်များ သို့မဟုတ် အခြားအသုံးပြုသူ ထည့်သွင်းမှုများကို လက်ခံသည့် အစိတ်အပိုင်းများတွင် ခွင့်ပြုထားသည်။
ဗားရှင်း- | CSS2 |
---|
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ရွေးချယ်သူကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးပါသည်။
Selector | |||||
---|---|---|---|---|---|
:focus | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
CSS Syntax
:focus {
css declarations;
}
နောက်ထပ် ဥပမာများ
ဥပမာ
<input type="text">တစ်ခုသည် focus ရသောအခါ၊ အကျယ်ကို 100px မှ 250px သို့ တဖြည်းဖြည်းပြောင်းပါ
input[type=text] {
width: 100px;
transition: ease-in-out, width .35s ease-in-out;
}
input[type=text]:focus {
width: 250px;
}
ဆက်စပ်စာမျက်နှာများ
CSS သင်ခန်းစာ- CSS Pseudo အတန်းများ