Gistの動的取得
Gist を張り付ける際に Gist の CSS が読み込まれてほしくない人向け情報。
API を使う方法
https://api.github.com/gists/:id
に GET を投げると gist の内容を返してくれる。
この方法だと、プレーンテキストでの取得になるので、コードハイライトが必要なら Highlight.js とかを使う必要がある。
インラインフレームを使う方法
iframe
要素の中で Gist Embed のスクリプトを実行して、生成された HTML だけを取ってくる方法。
あとは対応する CSS を書けばいいだけ。
クラス名は GitHub の中の人が linguist リポジトリのコメントで 、linguist のスコープ名との対応表を出してくれているので、それを参考にして色を付けたりすれば良さそう。
スタイルを上書きしたいだけなら…
優先順位を上げればいいだけなので、
こんな感じで親になる要素を先頭にくっつければいいだけ。