[html] Specify a Root Path of your HTML directory for script links?

I'm writing a template for dreamweaver, and don't want to change the scripts for subfolder pages.

Is there a way to make the path relative to the root directory?

for example:

<link type="text/css" rel="stylesheet" href="**root**/style.css" />

Instead of **root** above, I want a default path there. Is there any way to do anything like this?

This question is related to html path

The answer is


As Alexander Jank mentioned <base href="http://www.example.com/default/"> is great. When using sub-domains e.g. default.example.com base works great, because the JS and CSS loads from the said sub-domain and is accessible to both default.example.com and example.com/default

When using the root path, and your JS and CSS files are located in example.com/css, or example.com/js, then the subdomain has no access and the root of the subdomain is not accessible, except using the base.


You can use ResolveUrl

<link type="text/css" rel="stylesheet" href="<%=Page.ResolveUrl("~/Content/table-sorter.css")%>" />

Use two periods before /, example:

../style.css

/ means the root of the current drive;

./ means the current directory;

../ means the parent of the current directory.


I recommend using the HTML <base> element:

<head>
    <base href="http://www.example.com/default/">
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
</head>

In this example, the stylesheet is located in http://www.example.com/default/style.css, the script in http://www.example.com/default/script.js. The advantage of <base> over / is that it is more flexible. Your whole website can be located in a subdirectory of a domain, and you can easily alter the default directory of your website.


Just start it with a slash? This means root. As long as you're testing on a web server (e.g. localhost) and not a file system (e.g. C:) then that should be all you need to do.


This is oddly confusing to me. I know it shouldn't be. To check my understanding, I'd like to use a family relations model to compare. Assuming "You" is the current webpage, is the following correct?

<img src="picture.jpg">            In your folder with you, like a sibling
<img src="images/picture.jpg">     In your child's folder, under you
<img src="../picture.jpg">         In your parent's folder, above you
<img src="/images/picture.jpg">    In your cousin's folder

So, up to parent, over to sibling, down to their child = your cousin, named "images".