Resource paths in HTML

In HTML, you can specify paths to resources in several different ways.

Types of resources

Typical resources include:

Absolute paths are one of several ways to specify a path from a web page to an external resource.

This applies to external style sheets, and external JavaScript files.

Only style sheets and JavaScript files which you host on your own web site
This does not apply to style sheets or JavaScript files you access via Content delivery networks

Absolute paths begin with a forward slash (/) character.

Example: making a link to an external style sheet:

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

Custom CSS:

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

I recommend absolute paths as easier to use (as compared with relative paths).

A relative path looks something like this:

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

Custom CSS (if in subfolder):

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

Custom CSS (if in home page):

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

The "../" indicates "move one level closer to the root."

A fully-qualified URL specifies the protocol and the full path.

Example:

In the above example, the protocol is "http://"