Стилизовање компоненте у Vue оквиру

За стилизовање компоненти у фајлу компоненте потребно је написати таг style:

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

У овом тагу ћете моћи да пишете CSS код, при чему ће се он примењивати само на HTML код компоненте, и неће бити примењен негде ван ње. Ово је урађено посебно ради погодности.

Хајде да погледамо на примеру. Рецимо да имамо неке параграфе:

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

Хајде да их обојимо у црвену:

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