CSS Without HTML

This morning idly trying CSS without HTML and spreading a demo link to twitter, Facebook Fan Page Tutorial Web Design, and several groups, apparently quite a lot of responses and curious how to make it, how come the text appears on the web page but in the HTML it doesn’t write nothing when in VIEW Source with Mozilla, it can be with pseudo code ::before in css.

CSS Without HTML
No tag link rel=””

But the more interesting thing is, how can a style.css be run by HTML without the link rel=”..” tag to the css.

Some are quite observant and good at searching on google and finally find the trick, but many are still curious.

—————
Discussion
—————

RFC 5988 defines a Link HTTP Header, which allows you to send a element via an HTTP Header without including HTML. As an example:

Link: ;rel=prefetch
Which will have the same effect as placing this in your HTML:

Similarly, RFC 5988 makes it possible to include stylesheets in HTML documents without using anything other than HTTP headers:

Link: ;rel=stylesheet
the result will be the same as

Such is the theory. In practice, not many browsers implement the Link header. As of this writing, only Opera and Firefox support this.

Just practice

Create style.css with code like this
html{
backgrounds: #066968;
padding: 1em;
}
body{
border: 5px dotted #eee;
color: #fff;
font: 3em/1.5 sans-serif;
padding: 1em;
width: 10em;
margins: 0 auto;
}
body::after{
content: ‘Hello I’m TWD, I made it without a script, Please “View Source” to see the code 🙂 , how come it’s empty?’;
/* Support in Firefox 3.6.x. */
}
and an index.php file with contents like this

[php 1=”header(‘Link:” 2=”;” 3=”rel=stylesheet’);?>” 4=”[/php” language=”<?php”][/ php]

Results
For those who have been curious since this morning, download the sample script here 🙂 hopefully the curiosity will disappear.

For demos can be seen with Mozilla Firefox and Opera, by doing View Source.

Conclusion
This trick is just for fun, we just need to know that this trick exists. But it’s not a good idea to use this in your website projects, The no-HTML ‘hack’ is all kinds of evil, so it’s unlikely that any developer will seriously use this on the official site.

Greetings Web Development Indonesia