昔書いた社内ブログ記事です。
どうも（＠・ω・＠）
CSSには :before :after という擬似要素がありますよね。
英語のページで見ると擬似要素は「pseudo elements」なのですが、pseudoというスペルを見ると目がイガイガするのは私だけでしょうか。
この擬似要素を使うと、要素内の文字列の前後に文字や画像の追加ができます（ｐ・ω・ｑ）
+
例えばこのDIV要素の
HTML
<div id="letter">引っ越しました。</div>
前後に表示する文字を指定してあげると
CSS
#letter:before {
content: 'こんにちは。';
}
#letter:after {
content: 'それではまた。';
}
ページの見出しの左に画像を付けたり、「次のページ→」の「→」を付けたり、あるいはボックスエリアの影の画像を付けるのに使ったり・・
かなり応用範囲が広く便利な機能です。
+
そんな :before :after を使うと、CSSだけでWebページを作成することができます。
劇的（笑）
最近のブラウザは賢いので、<html> や <body> が無くても、画面を表示するときに補完してくれるんですね。いやはや。
このCSSすらをHTMLファイルに書かずにできる方法があるのですが、それにはPHPでHTTPヘッダーを指定しないといけないので、こちらの情報元のサイトのデモを見てみてください。
デモ
Using CSS without HTML | CSS-Tricks
本当に一行もソースが書かれていないHTMLファイルです（ノﾟдﾟノ）
ダウンロードしてみるとわかります。
これを利用すれば、HTMLが空っぽのWebサイトを作ることができますね！
そんな需要はないと思いますが（笑）