80年代へようこそ!

Welcome back to the 80s!

80年代へようこそ! Welcome back to the 80s!

ソースコードを見やすく表示する「SyntaxHighlighter」

  |土曜日

ソースコードを見やすく表示する「SyntaxHighlighter」というのを試してみた。てか、このブログに実装してみた。

XHTMLやCSSをはじめ、各種言語に対応していて、「<pre class=”XXXX”>(ソースコードを記述)</pre>」とすることで、ソースコードを見やすく表示してくれる。”XXXX”のところには、対応する言語を入れる。例えば、CSSならば、「<pre class=”brush: css;”>(ソースコードを記述)</pre>」と記述する。すると、下記のように表示されます。

.sample {
margin: 20px !important;
margin: 10px; /* for only IE6 style */
}

だからどうしたって感もありますが、よくみるお飾りなので、自分トコにも入れてみました。

ライブラリは下記のサイト、Links の Download からダウンロードできます。

2009年4月24日現在、「syntaxhighlighter_2.0.296.zip」というファイルがダウンロードできます。

  最終更新日 :

 - WebTips

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

no image
ブログ記事の日付を元号表記にする その2

元号を表記する、その2です。今度こそ。できました。 …

no image
携帯でも表示可能なGoogleマップ、これは便利だ

サイト作成時、地図の表示には、クライアントからの意 …

no image
ファイル名に「_」アンダースコアを使えるようにする

ウェブページのファイル名に「_」アンダースコアを使 …

no image
MT4.21から4.23へのアップデート

セキュリティアップデート Movable Type …

no image
Web Design ギャラリーサイト

秀逸なサイトを見て刺激を受ける。恥も外聞もなく、素 …

no image
スタイルシートのカスタマイズ

まずは、テンプレートの確認。プロフェッショナル ウ …

no image
こんな企業サイトは嫌だベスト20

Webサイトで嫌われる企業サイトの理由ランキング上位20項目です。

no image
YouTubeの動画をPCに保存して携帯電話で見る方法

最近、携帯を買い換えたので、自分用のメモです。駄文 …

no image
静的ページを分割するプラグイン「PageBute」

静的ページを分割するプラグイン「PageBute」 …

no image
MT4で作られたウェブサイト

MT4で作られたウェブサイトを紹介しています。