Esclarecendo o @import

Olá Verônica, tudo bem?

O CSS tem uma função chamada @import que mescla os arquivos CSS, ou seja é usado para importar regras de estilo de outras folhas de estilo (arquivos CSS).

Quanto à sua dúvida, sim, o @import irá auxiliar para que não tenhamos vários href="" (referências), para outros CSS, neste caso, apenas com a função de ter a estilização padrão da página. Para obter a esta estilização padrão o professor estava com vários arquivos referenciados no arquivo HTML( index.html ). Utilizando o @import em outro arquivo ele fara a referência em apenas um arquivo que irá refletir sobre esta estilização.

Nesta aula o professor criou um arquivo CSS "base"(base.css) que será utilizado para realizar os imports. No exemplo que ele trás será o fundo, com as texturas e as linhas, o reset.css e aplicou estilos ao body e .container.

Então para otimizar a utilização do CSS ele fez todos os arquivos que tratavam de um mesmo assunto (estilização padrão) estarem no mesmo arquivo base.css e desta forma quem verá o código saberá que está organizado quando entrar para procurar a estilização da página.

No caso você poderá utilizar arquivos CSS que estão em outra pasta também, só indicar o "diretório" (pasta) por exemplo, se a pasta estivesse em outro diretório (./outrapasta/arq.css)

Nesta documentação abaixo você encontrará mais sobre a função do @import e como ele pode ser usado em outros momentos:

• https://developer.mozilla.org/pt-BR/docs/Web/CSS/@import

Espero ter ajudado

Até mais!