6 ms·
Single-Tag Website
- revskill 12y agoHTML is to seperate Content from Presentation. This is just a demo of capability of CSS :).
- arcatek 12y agoI remember seeing a demo of a website which didn't have any tag - I think the stylesheet was served by an http header that the browsers were automatically linking. I can't find the url. [edit] Here it is! It still doesn't work in Chrome. http://css-tricks.com/using-css-without-html/ http://css-tricks.com/using-css-without-html/
- nkozyra 12y agoFar more interesting than a simple exploitation of the 'content' CSS attribute.
- JetSpiegel 12y agoI can see where the next exploits will come from, the stylesheet doesn't even appear on Firefox Dev Tools.
- jakub_g 12y agoIt does for me (Fx35, Windows), but yeah this looks pretty obscure, like the recent bash exploits from 30-year-old features barely anyone knew. Apart from exploits, semi-related, I just hope the ad industry won't find out about using inline data URIs any soon. This would make ad blocking way more difficult.
- Retric 12y agoAdds are served from a separate IP in part to keep websites honest. As long as this happens browsers can fairly easily tell what's an add. IMO, a more risky option is for add networks to start hosting webpages and I can easily see Google taking this approach.
- M4v3R 12y agoPity that it doesn't work in Webkit/Blink browsers, only in Firefox (and old Opera).
- sirn 12y agoI remembered using this trick to put a "THIS IS STAGING" banner for my project back few years ago (after reading Eric Meyer's article[1]) It was pretty cool back then. [1]: http://meyerweb.com/eric/thoughts/2009/01/22/using-http-headers-to-serve-styles/ http://meyerweb.com/eric/thoughts/2009/01/22/using-http-head...
- TazeTSchnitzel 12y agoThis, combined with data: URIs, could be fun...
- jakub_g 12y agoSince we're talking about obscure hacks, I've seen a website putting ads in an <iframe>, whose URL was the same as the parent (top) URL, and there was even no HTTP request being done for an iframe document (probably due to the URL being already cached by the browser) - so it was not possible to block it via a blocking proxy. I only managed to block it with the adblock's element hiding query like `domain.com##iframe` or through a userscript.
- pluma 12y agoAmazing what pseudo-elements can do these days.
- viame 12y agoPretty cool. Thanks for sharing
- cabirum 12y agoMakes text uncopiable in all browsers. Combined with entity-encoded source, this could make a decent protection against most users. Not that I approve such things. [edit] unicode encoding (\67). html-entities do not work.
- deleted 12y ago[deleted]
- chdir 12y agouncopiable : for most users.
- j2kun 12y agoNothing is uncopiable for someone with a good OCR library and a lot of time.
- adsfasdf23f23f 12y agoNothing is uncopiable for someone with a lot of time.
- frevd 12y agoCtrl+A seems to work fine (IE11)
- deleted 12y ago[deleted]
- underyx 12y agoI embraced this idea a while ago on https://macko.mici.hu https://macko.mici.hu — purely for childish entertainment, without any actual content. Source here: https://github.com/underyx/mici.hu https://github.com/underyx/mici.hu macko.mici.hu loosely translates to pooh.winnie.hu; mici is also the nickname a friend of mine goes by, which is why I bought the mici.hu domain.
- tshadwell 12y agoYou can do this /without/ a link tag in Firefox by using a link header. Syntax is: Link:<[filename]>;rel=stylesheet It's fun to use: Link:<.>;rel=stylesheet and detect the Accept: text/css header to serve a css file conditionally, too.
- RubyPinch 12y agoanyone know why parts of the page become links? Firefox35 edit: Oh, I suppose the <link> would be styled, wouldn't it?
- madaxe_again 12y agoI see mountainous CSS abuse... now you could be really clever and do it without any elements. Go on. I dare you.
- xenonite 12y agoSeems to be a clever idea for caching and reducing traffic. All static content can be stored within the CSS, which is tagged with a long HTTP expire date. This allows to send all dynamic content within a tiny HTML page that only references the CSS above, thereby adding the static content.
- tuananh 12y agoThis is exactly what I did when a friend of mine asked how to make the text uncopy-able. I did server-side rendering, create a bunch of randomize tag and generate inline css with ::before and ::after. It was brutal but it works.
- danso 12y agoWell, thank goodness for accessibility requirements, at least in California. There would be plenty of site owners, including the government, who'd love to make their sites much more difficult to scrape or excerpt from.
- hharnisch 12y agoImpressive! How did you end up debugging things as you were developing?
- bikamonki 12y agoI bet the css file is not developed per se but created by some sort of CMS.
- 3ot 12y agomeh, not even responsive. ;)
- pjc50 12y agoI think this shows that the "Content" tag in CSS is a bad idea, at least if you're concerned about separating presentation and content. It's a bit like a single-image website.
- saidajigumi 12y agoNo, it just shows that shoveling all content into your CSS is a bad idea. The content property has legitimate uses, especially when combined with tools like icon fonts, etc.
- deleted 12y ago[deleted]
- txu 12y ago1. need a 'compiler' to compile html and css into one css file 2. seems it can make embedding content a bit easier and cleaner. eg. embed a facebook/twitter button.
- Raphael 12y agoExpected a custom element. <x-website></x-website>
- thomasreggi 12y agome too
- ForHackernews 12y agoWhy would you do this?
- leonardofed 12y ago#CSSporn