Стилизация компонента в фреймворке Vue
Для стилизации компонентов в файле
компонента нужно написать тег
style
:
<script>
</script>
<template>
</template>
<style>
</style>
В этом теге можно будет писать CSS код, при этом он будет применяться только к HTML коду компонента, и не будет применен где-то вовне. Это сделано специально для удобства.
Давайте посмотрим на примере. Пусть у нас есть некоторые абзацы:
<template>
<p>
1
</p>
<p>
2
</p>
</template>
Давайте покрасим их в красный цвет:
<style>
p {
color: red;
}
</style>
Стилизуйте теги вашего компонента.