らい帳

プログラミングコードをシンタックスハイライトで表示する

コード

プログラミングのコードを表現したい場合はコードの文字列を`(バッククウォート)で囲うと、囲われた部分の文字列はコードとして表現されます。

入力
変数に値を代入するには`a = 3;`のようにします。

変数に値を代入するにはa = 3;のようにします。

シンタックスハイライト

複数行に渡るプログラミングのコードをシンタックスハイライトで色付けをしてわかりやすく表示するには以下のようにします。

ハイライトしたい言語名を```のあとに記載します。

本ソフトではシンタックスハイライトにhighlight.jsを使用しています。

シンタックスハイライトに対応している言語名などは公式サイトでご確認ください。

入力
```javascript
const a = 'testです';
console.log(a); // testです
```
const a = 'testです';
console.log(a); // testです

表題

言語名のあとに:XXXと記載するとXXXは表題として表示されます。

ファイル名や補足情報などをコードと一緒に表示できます。

入力
```javascript:サンプル.js
const a = 'testです';
console.log(a); // testです
```
サンプル.js
const a = 'testです';
console.log(a); // testです

行の強調、差分(diff)表現

行の先頭に!をつけるとその行はハイライトされます。

また+または-をつけると、追加行または削除行として表現されます。

プログラミングのソースでは行の先頭が!+で始まることもあるかと思います。

ハイライトをさせたくない場合は+-の前に\を記載します。また、markdown設定にてこの機能自体を無効にすることもできます。

入力
```javascript:test.js
const a = 'testです';
console.log(a); // testです

-const b = a + '、';
+const b = a + '。';
!alert('強調行です');
\++ // これは差分表現されません。
```
test.js
const a = 'testです';
console.log(a); // testです

const b = a + '、';
const b = a + '。';
alert('強調行です');
++ // これは差分表現されません。


Related Posts

  • テーブル(表)を表現する

    テーブル(表)形式で表現したい場合は、以下のようにします。:の位置で文字寄せを指定できます。先頭に:XXXを記載すると、XXXは表題になります。


  • 文献などの引用を表現する

    文献などを引用を示すための表現をする場合は文章の先頭にを記載します。複数行に渡る文章の引用を示す場合はそれぞれの行の先頭にを記載します。Markdown(マークダウン)は、文書を記述するための軽量マー...


  • 数式をLATEXで表現する

    $$で囲うとLATEXの形式で数式を表現できます。$だと、文章中に数式を表現できます。数式の変換ライブラリはkatexを使用しています。詳しい使い方は公式ページをご確認ください。半径 rrr の円の面...


  • 箇条書きのリストを表示する

    箇条書きリストを表現するにはリストの各項目の先頭に*または-または+を記載します。+を使用した場合は、リストの先頭の・が表示されませんが、その代わりにアイコンリストとしてフォルダ構成などを表現できます...


  • 他のページヘのリンクを作成する

    別ページヘのリンクを作成するには[リンクテキスト](リンク先URL) ツールチップの形式で指定します。同一サイト内へのリンクは同じタブ、外部サイトへのリンクは新しいタブで開きます。wikipedia同...


  • 太字、斜体、打ち消し線、マーカーなどで文字を修飾する

    *や_などの記号を用いて、文字を太字にしたり、下線を引いたりすることができます。太字にしたい文字列を**または__で囲うと、囲われた部分の文字列は太字になります。このソフトを使用すれば、プログラミング...


  • 画像を表示する

    画像を表示する場合は、![画像の説明](画像のURL 画像タイトル)の形式で指定します。同一サイト内の画像の場合は以下のようにページ名とファイル名だけで指定することも可能です。/ファイル名/画像名の形...


  • 水平線を引いてコンテンツの区切りや改ページを表現する

    水平線を引いて記事の大きな区切りを表現したい場合は---または___または***を記載します。コンテンツ1コンテンツ2コンテンツ3*ではなく_で水平線を表示した場合は、改ページをする機能があります。印...


  • 見出し(ヘッダ)と段落をつける

    行の先頭に#をつけると、その行は見出し(ヘッダ)になります。見出しのレベルは1〜6まで用意されており、#ならレベル1 ######ならレベル6となり、レベルが小さいほうが大見出しとなります。# 見出し...


  • 警告文やポイントを表現する

    注意点やポイントなどを警告文の形で表現できます。デフォルトで用意されている種類は以下の4つです。cssの理解がある場合は種類を増やしたり、独自のスタイルにすることも可能です。