読者です 読者をやめる 読者になる 読者になる

Milk+ea

Weblog Is My Hobby.

SassなどをシンタックスハイライトされたHTMLに変換するサイト

サイト制作

Cotane Cotane

久しぶりの制作。


Markdownで```sass・・・こんな感じに書くとこうなります。

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

CotaneでHTML化して貼り付けるとこんな配色にできます。


$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

font-weightbackgorundみたいなスタイルは貼り付け先の<pre>にスタイルを適用しておく必要があります。


Sassの他にもHTMLとCSSJsonCoffeeScriptとかもシンタックスハイライト化できます。 ただCoffeeScriptの場合""" ~~~ """という構文を使うとエラーが起きるんですが、直し方が分からないので直せないんでしょう、きっと。
あと結構ザルなのでワンライナー系とか、すごすぎる構文を突きつけられるとうまく色付けできない可能性が大です。その場合は、結果は右に反映されるので左のコードをちょろっと優しい構文に変えてやるとイイかもしれないです。

やりました・・・。やったんですよ!必死に!その結果がこれなんでs(ry