Стилизација на компонента во рамката 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>