Estilização de componentes no framework Vue
Para estilizar componentes, no arquivo
do componente, você precisa escrever a tag
style:
<script>
</script>
<template>
</template>
<style>
</style>
Nesta tag, você pode escrever código CSS, e ele será aplicado apenas ao código HTML do componente, e não será aplicado em nenhum outro lugar. Isso é feito especificamente para conveniência.
Vamos ver um exemplo. Suponha que temos alguns parágrafos:
<template>
<p>
1
</p>
<p>
2
</p>
</template>
Vamos colori-los em vermelho:
<style>
p {
color: red;
}
</style>
Estilize as tags do seu componente.
