ACJ’s Styling StyleSheets

Posted: October 25 2005

Yes, that�s right; styling stylesheets. Sounds silly, doesn�t it? What if I tell you I will be styling a stylesheet with itself in the example? Well, I will.

In my writings about css, I often link directly to style sheets. I always considered it kind of annoying (albeit very logical) that these files appeared as plain text. Tonight, I decided to do something about it. The silly thing is, it actually works (in Mozilla, that is).

I have constructed a little test file � stylesheet.php � to illustrate the process. (I have a more complex example, but I�m saving that for the next CSS Reboot.) This is the source (skip):


<?php
header('Content-Type: text/css; charset=UTF-8');
header('Link: <stylesheet.php>; rel="stylesheet"');
?>

/* This background ... could be green. */

*:root {
	background: #0f0;
	color: #000
}

As you can see, it�s a PHP: Hypertext Preprocessor file that is assigned a http header that sets the mime-type to text/css and then applies the stylesheet to itself via a Link header (wich is valid in HTTP/1.0 � not HTTP/1.1).

The rest of the document is plain css that assigns a lime background to the (non-existant) root element. You can even style both the html as the body element (that don�t exist either, obviously). This has to do with the way Mozilla renders the dom tree, but that�s another story.

I tried assigning other link relations, like shortcut icons, and authors, but � even though Style Sheets in HTML documents says The HTTP Link header has the same effect as a LINK element with the same attributes and values � that didn�t work out.

ACJ

Comments

3 comments so far.

1/3

nerd.

Posted by: jardoop on October 26, 2005, at 21:09

2/3

Why would you want to style your own stylesheet? :x Sorry, I fail to see why you'd want to do that. Maybe I'll "get it" when you've finished your top secret project which features all this, and more. :)

Also, directed at the comment before this one: haha.

Posted by: Agilo on November 5, 2005, at 13:51

3/3

Too bad this does not work in modern browsers (and Internet Explorer). I tried with the newest Opera and Firefox. Do you know about another way of styling stylesheets? (Then please email me.)

I thought of using this as a kind of copyright protection on my stylesheets. I thought of styling my stylesheets with display: none;. That way people trying to steel from my stylesheets would be greated by a blank document. Too bad it does not work.

Posted by: Daniel Aleksandersen on June 27, 2007, at 18:57