Vue Framework တွင် Component ကို Style သတ်မှတ်ခြင်း

Components များကို style သတ်မှတ်ရန် component file အတွင်း၌ style tag ကို ရေးရပါမည် :

App.vue<script>
  
</script>
<template>
  
</template>
<style>
  
</style>

ဤ tag အတွင်း၌ CSS code များကို ရေးသားနိုင်ပြီး၊ ၎င်းသည် component ၏ HTML code အတွက်သာ အကျုံးဝင်ကာ အပြင်ဘက်တွင် အကျိုးသက်ရောက်မှု ရှိမည်မဟုတ်ပါ။ ဤသို့ပြုလုပ်ထားခြင်းသည် အဆင်ပြေစေရန် ဖြစ်သည်။

ဥပမာတစ်ခုဖြင့် ကြည့်ရှုကြပါစို့။ ကျွန်ုပ်တို့တွင် paragraph အချို့ ရှိသည်ဆိုပါစို့:

App.vue<template>
  <p>
    1
  </p>
  <p>
    2
  </p>
</template>

၎င်းတို့ကို အနီရောင် ဆေးကြောကြပါစို့:

App.vue<style>
  p {
    color: red;
  }
</style>