Pathing backwards in html

Neomega

Deity
Joined
Feb 9, 2002
Messages
11,261
I am playing around with .css files, and I was thinking I want to use just one, but for the sake of simplicity, I need to break up the "webpage" into different folders. To save space, it would be best ot use only one .css file, so I have it set in my webpage's root directory.

How do I make the other .html files path back to the single .css file. I figured out how to make paths now, but can HTML path backwards?
 
Could you just do <link rel="stylesheet" type="text/css" name="mystyle" href="www.yourwebsite.com/yourstyle.css">? When it doubt, just write the whole path out.

Is this what you are asking?
 
Ginger_Ale said:
Could you just do <link rel="stylesheet" type="text/css" name="mystyle" href="www.yourwebsite.com/yourstyle.css">? When it doubt, just write the whole path out.

Is this what you are asking?

pretty much, except that what if it isn't a www. address?

Say the .CSS is in C:\Webpage\,

but most of the pages are in C:\Webpage\hobbypages\

but I also want pages in C:\Webpage\musicpages\ to use the same .css.....

I don't think <....href="\Webpage\mystyle.css"> works.
 
Why not make a folder C:\CSS?
(Or make this folder in the "DocumentRoot"-folder , if your webserver is APACHE)
You can use it for different projects.
 
If it is in your document root directory, then

<link href="/yourstyle.css" type="text/css" rel="stylesheet">

will work from any directory. That way you don't have to count how many subdirectories down you are, or type the entire URI. Starting any href or src specification with "/" refers to the document root directory.
 
IbnSina said:
If it is in your document root directory, then

<link href="/yourstyle.css" type="text/css" rel="stylesheet">

will work from any directory. That way you don't have to count how many subdirectories down you are, or type the entire URI. Starting any href or src specification with "/" refers to the document root directory.

The only command I understand here is the "href"

What does the type= and rel= mean? I tried to look it up, but could not find it.

Also, I tried this, and it does not seem to work.

However chairman meow's suggestion did. Perhaps it is because my .css was not actually in my root directory.
 
Chairman Meow's suggestion will work, but you have change the number of ".." specs depending on where the html page is in your directory tree. I can't count, so I always just refer to pages with reference to the document root. That way, even if I move the page, I don't have to change the html. Better yet, if I'm doing php, then I can just use an include tag for all my headers, including the CSS.

If you have a page at C:\Webpages\mypage.html whose URI is

http://www.myserver.com/mypage.html

then C:\Webpages is your document root directory. Notice the difference in the direction of the slashes between URI and Windows directory specifications...

The type parameter just identifies the link mime type as "text/css".

The rel ("relation") parameter identifies it as a stylesheet. When the link tag was invented, the W3C people thought there were going to be dozens of types of links. As it happens, only 3 or 4 are supported by actual browsers, so these tags are probably less than necessary.
 
Neomega said:
The only command I understand here is the "href"

What does the type= and rel= mean? I tried to look it up, but could not find it.

Also, I tried this, and it does not seem to work.

However chairman meow's suggestion did. Perhaps it is because my .css was not actually in my root directory.

rough translation to follow:
type and rel are to identify what content the browser is to expect when absorbing the contents of the linked css file

another identifier possible to use is media=
this has varying results on different browsers afaik
example: media="screen" or media="print"
which lets you specify different stylesheets for different media, one to view onscreen, one to reformat the text to be printable

to read up on CSS standards - www.w3.org
 
Okay, here's what you do:

Let's say your CSS is http://mysite.com/CSS/styles.css, and the file you are editing is http://mysite.com/index.html.

Go to the page you are editing, and call the CSS up like so (in the header):

Code:
<link rel="stylesheet" href="../CSS/styles.css" type="text/css" />

Just add more "../"s to the beging to go back more directories. For example, let's say you're editing http://mysite.com/gallery/index.html. You would use the following:

Code:
<link rel="stylesheet" href="../../CSS/styles.css" type="text/css" />

At some point, you may want to use php to include the files neccesary on all pages (it's often done to easily make changes to all pages). In that case, you'll want to do what GA demonstrated, and call it up as the whole path. But, don't forget to start it with http:// ;).

Example:

Code:
<link rel="stylesheet" href="http://mysite.com/CSS/styles.css" type="text/css" />
 
It's been a known feature in Windows for quite a while too. :)
cd ..\..\..\somedir.
 
Top Bottom