Định dạng kiểu cho component trong framework Vue

Để định dạng kiểu cho các component, trong file component cần viết thẻ style:

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

Trong thẻ này, bạn có thể viết mã CSS, và nó sẽ chỉ áp dụng cho mã HTML của component đó, và không được áp dụng ở bên ngoài. Điều này được thực hiện đặc biệt cho sự tiện lợi.

Hãy xem một ví dụ. Giả sử chúng ta có một số đoạn văn:

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

Hãy tô màu chúng thành màu đỏ:

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