CSS css não abre no chrome, da mensagem de erro

[jamalmalik]

olá, estou usando um notebook com sistema linux-mint, baixei o vs code e o google chrome. seguindo o passo a passo do curso que to fazendo de html e css me deparei com um problema que ta difícil de resolver. Faço tudo correto para linkar com o css, porém o google chrome não reconhece, da um erro como se o codigo estivesse errado. porém no firefox o estilo de texto que usei funcionou perfeitamente. já vi varios tutoriais mas até agora nada que eu fiz resolveu meu problema. o mesmo codigo eu fiz no vs code em uma maquina que roda o windows e funcionou. Alguém sabe como resolver esse problema ???

 

deixei uma imagem para vocês verem o que aparece. quando inspeciono a pagina.  

[DiF]

@jamalmalik  Pelo que eu vi na imagem, ali embaixo, ele diz o erro.    File not found....    ele não encontrou  o arquivo de estilo  CSS.   Reveja o caminho.  Como você está usando linux, talvez seja possível que você tenha que dar permissão de leitura no diretório do arquivo. 

 

As vezes acontece do cache estar cheio... tenta esvaziar apertando  ctrl + F5

[jamalmalik]

@DiF Fiz isso, e aparentemente ta tudo ok. se você tiver algum tutorial para que pode me mandar para eu dar uma olhada, serei muito grato !! pois esta difícil de entender o que esta acontecendo.

[DiF]

@jamalmalik Não tenho um tutorial desse tipo, geralmente o youtube costuma ter muitos da parte inicial.

 

Já tentou usar o caminho absoluto? 

[jamalmalik]

@DiF sou novo nesse sistema, ainda estou vendo alguns videos para poder aprender a usa-lo. Não usei esse caminiho, nem sei com usar direito. :(

[DiF]

@jamalmalik O caminho absoluto, é o endereço completo do arquivo no diretório.

 

Geralmente a gente usa o caminho relativo,  que é por exemplo:

Vamos supor que no root do servidor tem um diretorio chamado css, onde dentro dele tem o arquivo estilo.css.

Vou representar desta maneira:

/ (root)
|-css
   |-estilo.css

 

Quando você faz o link do arquivo no html, o caminho relativo é desta maneira:

<link rel="stylesheet" href="css/estilo.css">

 

Isso quer dizer, que ele vai buscar o arquivo estilo.css que está dentro do diretório CSS no root.

 

Quando dizemos que o caminho é absoluto, informamos o caminho completo do arquivo:

 

/css/estilo.css 

 

como pode ver, tem uma barra na frente do diretório, isso indica que ele deve procurar o arquivo a partir do root...

seria o mesmo que  http://localhost/css/estilo.css

 

 

No linux,   vamos supor que você está usando esta estrutura:

 

/
└── home/
    └── exemplo/
        ├── css/
        |   └── estilo.css
        └── link -> css/

 

Se digitar essa linha de comando no terminal:

readlink -f readlink -f exemplo/css/file.txt

 

iria retornar algo como

/home/examplo/css/estilo.css

 

Este seria o caminho absoluto.

 

Enfim...  veja se não faltou nada no seu código.. as vezes um erro comum de iniciante é esquecer de colocar uma barra, uma aspas, ou um ponto e virgula em algum código.. 

Teste o css direto no seu arquivo html para ver se o chrome está interpretando...

Mas uma coisa é certa, o erro que voce apresentou na imagem, é certamente de arquivo não encontrado...  ou seja, o chrome não conseguiu acesso ao diretório e o arquivo ou eles não existem.

 

Dica:

Instale o Lamp,  que seria o mesmo que o xampp do windows.  Coloque seu arquivos no www do root.. e teste... e claro, sempre rode o servidor apache para que funcione como um servidor local.