View source for Resource paths in HTML

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

== Types of resources ==

Typical resources include:

* [[External style sheet|External style sheets]]
* [[External JavaScript file|External JavaScript files]]
* [[Web image|Web images]]

=== Absolute paths ===

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 network|Content delivery networks]]

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

Example: making a <code>link</code> to an [[external style sheet]]:

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

Custom CSS:

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

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

A relative path looks something like this:

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

Custom CSS (if in subfolder):

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

Custom CSS (if in home page):

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

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

== Fully-qualified URL ==

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

Example:

<code>http://htcwebcreative.com</code>

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

== See also ==

* [[Cascading Style Sheets]]
* [[Hyperlink]]