Estilos de Componente Angular
Vamos agora estilizar nosso markup com
CSS. Para isso, usaremos o arquivo
app.component.css, onde são escritos
os estilos CSS para o markup do componente. O
Angular cuida para que os estilos
funcionem como módulos CSS. Isso significa que
todos os seletores funcionarão apenas para
o markup do componente e não afetarão
o markup externo.
Vamos ver na prática. Suponha que nosso componente tenha o seguinte markup:
<div>
abcde
</div>
Vamos definir uma cor para a div:
div {
color: red;
}
Com isso, podemos ter certeza de que o estilo será aplicado apenas às divs do nosso componente, e não a quaisquer outras.
Crie algum markup no arquivo de template. Escreva estilos para esse markup.