javascript – Link resources, such as CSS, within a site's structure

Question:

I'm a beginner and I'm having problems with linking the scripts, CSS and images. I have the following folder structure on my site, just an example:

- Pasta Raiz    
  --cadastro  
    --- cadastro.html
  --images  
    --- icon.png  
  --script  
    --- script.js  
  --style  
    --- cabecalho.css
  index.html

Assuming all the pages on my site have the same header, then I would have to import the CSS cabeçalho.css for all of them. For the home page it's easy.

But to call this same css on the cadastro.html page? In my point of view, for the cadastro.html the style cabecalho.css doesn't exist, I would like to know how to link them, because it is a complete disorganization to leave all your pages in the root folder.

Answer:

One way would be using the base tag to define the default url

<head>
<base href="http://meu-dominio/">
<link type="text/css" href="style/cabecalho.css">
</head>

In this way, the path will be the same on both the index.html page and the cadastre.html page.

<link type="text/css" href="http://meu-dominio/style/cabecalho.css">
Scroll to Top