SASS ရှိ ဒြပ်စင် selector များ တိုးချဲ့ခြင်း

@extend ညွှန်ကြားချက်ကို အသုံးပြုခြင်းသည် class selector များတွင်သာ ကန့်သတ်ထားခြင်းမဟုတ်ပါ။ မည်သည့် selector ကိုမဆို၊ ပင်ကိုယ် element တစ်ခုတည်းကိုပင် တိုးချဲ့နိုင်ပါသည်။ ဥပမာတစ်ခုဖြင့် ကြည့်ရှုကြပါစို့။

ဥပမာတစ်ခုကို စဉ်းစားကြည့်ပါ။

style.scss.active-link {
  @extend a:active;
}
  
a:active {
  color: blue;
}

ပြန်လည်ပြင်ဆင်ခြင်း၏ ရလဒ်အနေဖြင့်၊ .active-link သည် a:active မှ color ဂုဏ်သတ္တိကို အမွေဆက်ခံသည်ကို ကျွန်ုပ်တို့ တွေ့မြင်ရပါမည်။

style.cssa:active, .active-link {
  color: blue;
}

styles.scssbutton {
  @extend .box:hover;
}
  
.box:hover {
  color: #14147e;
}

styles.scssbutton:active {
  @extend input:focus;
}

button:blur {
  @extend input:blur;
}

input:focus {
  color: #14147e;
  border-color: #b5b5d1;
}

input:blur {
  color: #040433;
  background-color: #87878f;
}