概要
スタイルシートといえば<link>要素を使うのが一般的ですが，実はRFC的にはHTTPヘッダにLink:を使うことも出来るようになっています．ところがブラウザの対応状況が意外にも芳しく無く…
バグ報告もありますね．
rel=stylesheetだけならまだしも，rel=preloadな場合に正しく処理されていないとなるとかなり致命的な気がします．こういう自動プリロード付加処理をやろうとするとだいたいHTTPヘッダを使う方法になりがちなので．
検証用コード
test.css
h1 { color: red; }
test.php
<?php
$style = base64_encode('h2 { color: red; }');
header("Link: <test.css>; rel=stylesheet", false);
header("Link: <data:text/css;base64,$style>; rel=stylesheet", false);
header('Content-Type: text/html; charset=UTF-8');
?>
<!DOCTYPE html>
<title>Example</title>
<h1>HTTP URIのスタイルシート</h1>
<h2>DATA URIのスタイルシート</h2>
反映されればその文字列が赤くなります．
結果
| HTTP URI | DATA URI | |
|---|---|---|
| Firefox 45 | ◯ | ◯ |
| Chrome 49 | ✕ | ✕ |
| Safari 9 | ✕ | ✕ |
| Internet Explorer 11 | ✕ | ✕ |
| Edge 25 | ✕ | ✕ |
協力
@mpyw Edge/IE11ダメです pic.twitter.com/Msu1K7olsH
— sudosan (@sudosan) 2016年4月6日