scaleX လုပ်ဆောင်ချက်

scaleX လုပ်ဆောင်ချက်သည် အရာဝတ္ထုအား X ဝင်ရိုးအလိုက် အရွယ်အစားချဲ့ပေးသည်။ အရွယ်အစားချဲ့ခြင်းကို transform-origin ဂုဏ်သတ္တိဖြင့် သတ်မှတ်ပေးထားသော အမှတ်ကို ဗဟိုပြု၍ ဆောင်ရွက်သည်။ လုပ်ဆောင်ချက်၏ တန်ဖိုးမှာ ကိန်းပြည့် သို့မဟုတ် ဒသမကိန်း တစ်ခုဖြစ်သည်။ ၎င်းသည် 1 ထက် ကြီးလျှင် - အရာဝတ္ထုသည် ကြီးလာပြီး၊ ငယ်လျှင် (ဥပမာ၊ 0.5) - အရာဝတ္ထု သေးသွားသည်။ 1 ဟု သတ်မှတ်လျှင် ဘာမှ မပြောင်းလဲပါ (၎င်းသည် စံထားရာ တန်ဖိုးပင် ဖြစ်သည်)။

ဝါကျဖွဲ့စည်းပုံ

cssselector {
  transform: scaleX(number);
}

ဥပမာ

ဘလောက်ပေါ်သို့ မျှားတင်၍ X ဝင်ရိုးအလိုက် အရွယ်အစားကို 1.5 ဆ အထိ ချဲ့ကြည့်ပါမည်။

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleX(1.5);
}

Результат:

ဥပမာ

ဘလောက်ပေါ်သို့ မျှားတင်၍ အရွယ်အစားကို 2 ဆ အထိ လျှော့ချကြည့်ပါမည်။

html<div id="elem">lorem ipsum</div>
css#elem {
  border: 1px solid black;
  width: 100px;
  height: 50px;
}
#elem:hover {
  transform: scaleX(0.5);
}

Результат:

ဆက်လက်လေ့လာရန်

  • scale လုပ်ဆောင်ချက်,
    သည် X နှင့် Y ဝင်ရိုးများအလိုက် အရွယ်အစားချဲ့ခြင်းကို သတ်မှတ်ပေးသည်
  • scaleY လုပ်ဆောင်ချက်,
    သည် Y ဝင်ရိုးအလိုက် အရွယ်အစားချဲ့ခြင်းကို သတ်မှတ်ပေးသည်