CODEWITHSUNDEEP
htmlcss
Bruce
Bruce

Reputation: 911

Can I include a CSS StyleSheet from a local drive, in a page served from a web site

My goal is to have a page, served by a web site, containing a to a stylesheet, that is available not on the web site, and not on a different web site, but on a local drive.

Something like;

<!DOCTYPE html>
<html>
<head>
<link href="/styles/something.css" rel="stylesheet" />
<link href="file:///C:/custom.css" rel="stylesheet" />
</head>

My initial research shows that browsers don't seem to support this, but I'm willing to be proved wrong, or discover some sneaky way of doing it. (I tried the above, that doesn't work.)

[I know, I know, you wanna know "why". This is for the site designer - it would allow him to edit the css locally while designing and see the effect on the "semi-live" site. ie the round-trip for edits would be very fast, and I wouldn't need to give him access to the actual site. By extension, for teaching purposes, it would allow multiple people to simultaneously practice their CSS skills locally]

Obviously any edits made to the local file will only be visible on that local computer - that's the whole idea. If you had 10 students each would see the same site with a different css file.

Upvotes: 8

Views: 32786

Answers (5)

Efra
Efra

Reputation: 141

Just press Shift+F7 on Firefox (or Tools->Web Developer->Style Editor). In the window that opens you can import an entire file or you can also edit the styles loaded.

Upvotes: 7

JohnP
JohnP

Reputation: 50039

Well, if you can setup Apache on your machine, this is easily done.

This is assuming the question is this

I want to be able to have a site in a central location (live) and allow users accessing that site to be able to make changes to the site by editing a local file. These changes will only be visible to the person making the change and the rest will just see whatever CSS is on their local copy.

So this means that you have to serve a local file from multiple computers and each person viewing the site may have a different looking copy. If I'm right, read on.

Setup a local environment (maybe with WAMP?) on all the machines you want to be able to allow local edits. The important thing is that everyone must have the same hostname defined (either localhost, or something else - don't forget to add it to your hosts file). Place the CSS file inside your webroot and add a link to your live site pointing to that link. 

<link href="http://www.mysite.com/base.css" rel="stylesheet" />
<link href="http://localhost/custom.css" rel="stylesheet" />

And voila! Local editing.

Caveats

  1. Everyone needs to have their files placed in the same local URL otherwise it won't work

  2. You need to setup a local environment (very easy)

Upvotes: 7

Sangeet Menon
Sangeet Menon

Reputation: 9915

Yes you can!! Just need Firefox as a browser and you also need add on WEB DEVELOPER installed on it...

It allows to disable the inline CSS and add user CSS...

Download the add on WEBDEVELOPER

Once installed...after you restart firefox you will get a menu on the firefox window in which click on the CSS menu which will allow you options to disable and add user CSS

You will have to disable the inline CSS to see the CSS applied by the user to full effect

Upvotes: -1

amosrivera
amosrivera

Reputation: 26514

Just for the purpose of answering the question, yes he could serve a CSS file to your website, but he would have to have a server installed on his computer and a public access to his server IP.

Then in the href of the stylesheet you would write something like <link href="190.181.169.118/styles.css" rel="stylesheet" />.

Of course this is not the recommended solution, i would advise you to use some sort of browser extension / plug in for that.

Upvotes: 1

fabrik
fabrik

Reputation: 14365

Obviously, you can't. But why not try it and find out if this didn't work?

If the purpose of your needs is only for testing, i'll advice you install web developer extension where you can add local CSS to a website - for testing only.

Upvotes: 2

Related Questions