2
respostas

@imports Css

Olá, acabei de terminar todo o curso, porém pensei que ao final o professor iria importar todos os arquivos css para somente um, foi o que eu fiz, criei um style.css e importei todos para ele, queria saber se isso fere as boas práticas?

2 respostas

ola amigo .. das duas formas estao corretas varia de projeto para projeto, no caso se voce tem um projeto extenso com varias paginas o ideal e criar arquivos .css separados para ficar facil de ler e ate mesmo em manutenção futura, imagina um .css de 25 paginas de um projeto escrito em um unico documento e derrepente voce precisa corrigir um erro na pagina 17 ?

agora se voce cria um documento.css para cada pagina entao voce sabe que e so ir no documento 17.css .. voce conseguiu pegar o macete sobre importar varios documentos.css ?

espero ter ajudado.

Sim meu rei, eu criei vários arquivos css só que em vez de exporta-los no html eu fiz um arquivo "main.css" só para receber todos os @imports para deixar meu html mais limpo, daí queria saber se é válido e se as empresas usam esse método, ou se não é uma boa pratica fazer isso.

  1. style.css
  2. @import url(cabecalho.css);
  3. @import url(menu/menu-item.css);
  4. @import url(menu/menu-link.css);
  5. @import url(menu/menu-lista.css);
  6. @import url(./banner/banner-imagem.css);
  7. @import url(./banner/banner-titulo.css);
  8. @import url(./banner/banner.css);
  9. @import url(./sobre/sobre.css);
  10. @import url(./sobre/sobre-descricao.css);
  11. @import url(./sobre/sobre-titulo.css);
  12. @import url(./receita/receita-botao.css);
  13. @import url(./receita/receita-conteudo.css);
  14. @import url(./receita/receita-descricao.css);
  15. @import url(./receita/receita-imagem.css);
  16. @import url(./receita/receita-titulo.css);
  17. @import url(./receita/receita.css);
  18. @import url(./quemSomos/quemSomos-descricao.css);
  19. @import url(./quemSomos/quemSomos-titulo.css);
  20. @import url(./quemSomos/quemSomos.css);
  21. @import url(pessoas.css);
  22. @import url(./pessoa/pessoa-funcao.css);
  23. @import url(./pessoa/pessoa-imagem.css);
  24. @import url(./pessoa/pessoa-nome.css);
  25. @import url(./pessoa/pessoa.css);
  26. @import url(./rodape.css);
  27. @import url(logo.css);