Adicionar estilo

  • 2 minutos

Ao usar o React, você está criando HTML. O método de criação é diferente, mas o navegador ainda renderiza HTML, CSS e JavaScript.

Podemos até mesmo adicionar CSS aos componentes para aplicar estilo a eles. Para adicionar CSS a um componente, nós o referenciamos da mesma maneira que importamos qualquer outra dependência JavaScript.

Adicionar CSS

  1. Adicione um novo arquivo à pasta src. Nomeie-o como index.css.

  2. Adicione o seguinte estilo ao arquivo:

    article {
    margin-left: 10%;
    margin-right: 10%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 18px;
}

    Fique à vontade para personalizar esse estilo.

Importar o CSS

  1. Abra o arquivo App.jsx.

  2. Na parte superior do arquivo, adicione as seguintes linhas de código:

    import './index.css'

  3. Volte para o navegador e atualize-o. O site foi atualizado com o novo estilo.