記法サンプル

Settingsで設定したUserCSSの表示テスト用ページ

UserCSSの確認は→settings を変更したときにテストする項目を並べたページも

でかい文字

リンク

#ハッシュタグ

リンク

###存在しないリンク###

/help-jp/ブラケティング（外部プロジェクトリンク）

外部プロジェクトリンク(scrapbox.io)

生のURLもリンクとして認識される：https://example.com 空白を末尾に入れれば、それ以降の文字列をURLから切り離せる

[]で囲めば、のように空白を入れずに文章をつなげられる

外部リンクを区別するUserCSS

外部サイトリンク

Twitterのリンク

特定のリンクにアイコンをつけるUserCSS

コードブロック

code:コードブロック.py

print("Hello World!")

ファイル名なしコードブロック

code:py

print("Hello World!")

インデントつき

code:インデント.md

- インデント

言語を強制

code:python(js)

console.log("I'm JavaScript");

文芸的プログラミング

標準ヘッダファイルをインクルード

code:main.cpp

#include <iostream>

main函数の定義

code:main.cpp

int main() {

std::cout << "Hello, C++" << "from scrapbox.io" << std::endl;

}

テーブル

table:表組み

■ 列2

行2 ■

リンクイドバタニシ.iconアイコンイドバタニシ.icon*3

とてもながいてーぶるのてすと The test for very long table

文芸的CSV

table:plot

x y

0 1

1 1

2 2

3 3

フィボナッチだ！

table:plot

4 5

5 8

6 13

7 21

8 34

9 55

数式

$ e^{i\theta}=\cos\theta+i\sin\theta

文章の中に$ \text{数式}を入れる

$ a_{n+1}=a_n+1

あれ？箇条書きの点消えるんじゃなかったっけ？

数式行にも常にバレットを表示するUserCSSが利いてるっぽい

Scrapboxの数式記法

文字装飾とか

通常

太字

リンク入り太字イドバタニシ.iconhttps://scrapbox.io タイトル付きリンクに加え、埋め込み記法https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.pngも入れられる #ハッシュタグ

[[リンクとアイコンは書き込めるが、文字装飾は書き込めない]]

取り消し線

下線

斜体(Italic)

インラインコード

\`をescapeできる

引用文

インデントつき引用文

中にはリンクや$ \text{数式}も書けます

中に箇条書きを書く

タブ or 半角スペース or 全角スペースでインデントできる

? Helpfeel

css:code.helpfeel

$ コマンド

css: .text.cli(%と同じ)

% コマンド

　: 空白記法

% コマンド

ブラケット記法

デフォルト

[]:abcABC123あいう

マーカー記法

*: abcABC123あいう

/: abcABC123あいう

-: abcABC123あいう

_: abcABC123あいう

UserCSS

": abcABC123あいう

インライン引用記法

#: abcABC123あいう

ネタバレ防止記法

無効化された

白黒記法

イドバタニシ.icon

%: abcABC123あいう

スプレッドシート的に使う記法

&: abcABC123あいう

愚痴記法

': abcABC123あいう

中央揃え記法

.: abcABC123あいう

リンクを出典アイコンにするUserCSSSettings#6157ebcf1280f00000ad87f1

{: abcABC123あいう

}: abcABC123あいう

ふきだし記法

|: abcABC123あいう

画像を並べて表示する記法

123456

<: abcABC123あいう

るびきほうルビ記法

あまり使われてない？bsahd.icon

>: abcABC123あいう

ユーザーフラッグ記法

~: abcABC123あいう

曇りガラス記法

/: abcABC123あいう

イドバタニシ.icon

アイコン記法を画像記法っぽくするUserCSS

-: abcABC123あいう

イドバタニシ.icon

iconを回転する記法

!: abcABC123あいう

イドバタニシ.icon

iconを振動させる記法

(): abcABC123あいう

blu3mo.icon

イドバタニシ.iconだとわかりにくいのでblu3mo.icon氏のアイコンをお借りしましたMijinko_SD.icon

iconを丸くする記法

,: abcABC123あいう

行内で小さくするUserCSS

+!: abcABC123あいう

明朝体記法

+_:abcABC123あいう

_+:abcABC123あいう

文法エラー・警告をIDE風に表示するUserCSS

未使用

(: abcABC123あいう

): abcABC123あいう

単体で使われていないだけで、(と)を同時に使うとiconを丸くする記法になるMijinko_SD.icon

今後単体で使う場合は、.deco-\):not(.deco-\() {}といった感じで両方使われた場合は無効化する工夫が必要になるかもしれない

+: abcABC123あいう

(提案)+のブラケット記法はサンドボックス的な用途のために残しておきたい

[(使用されていない|空いている)(装飾|かっこ|ブラケット)記法の記号] (使用されていない装飾記法の記号) (使用されていないかっこ記法の記号) (使用されていないブラケット記法の記号) (空いている装飾記法の記号) (空いているかっこ記法の記号) (空いているブラケット記法の記号)

（使用されていない記号を検索したらここに飛ぶ様にしたいという意図のリンクです↑）blu3mo.icon

なるほどMijinko_SD.icon

文字装飾記法の書き方

[何か適用文字]

[* 太字]：太字

記号を重ねると効果が重複する(順不同)

色々てんこもり

UserCSSで特殊コンボを設定している場合もある

例：イドバタニシ.icon

入れ子

[[ マーカー記法が適用されないよう]]

- 文字装飾記法内部のブラケットは、問答無用でリンクか埋め込み記法とみなさされる。https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png

$ \text{数式}は入れ子にできる

[_ 空白記法は入れられない ]

#hashtag 、iconイドバタニシ.iconは入れられる

タイトルつきリンクも認識可

二重ブラケティングする記法は埋め込められない[https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png]

箇条書き

箇条書きのバレットをFontAwesomeにするUserCSS

アイコン

[イドバタニシ.icon]イドバタニシ.icon アイコン

[イドバタニシ.icon*3]イドバタニシ.icon*3繰り返しアイコン

[イドバタニシ.iconx3]イドバタニシ.iconx3繰り返しアイコン(xも可)

イドバタニシ.icon*1000繰り返しアイコン (最大1000個)

イドバタニシ.icon大きなアイコン

イドバタニシ.icon

埋め込み

画像

単体画像

https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png

高さ制限をなくす

https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png

リンク付き画像

https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png https://google.com

Gyazo

https://gyazo.com/da78df293f9e83a74b5402411e2f2e01

リンク付きGyazo

https://gyazo.com/da78df293f9e83a74b5402411e2f2e01 https://google.com

5連続画像

https://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.pnghttps://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.pnghttps://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.pnghttps://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.pnghttps://i.gyazo.com/da78df293f9e83a74b5402411e2f2e01.png

画像を並べて表示する記法

location記法

ピンなし

N35.6576943,E139.7452035,Z16

ピンあり

N35.6576943,E139.7452035,Z16 東京タワー

複数ピン

動画

Youtube

https://www.youtube.com/watch?v=LSvaOcaUQ3Y

Youtube再生リスト

https://www.youtube.com/playlist?list=PLmoRDY8IgE2Okxy4WWdP95RHXOTGzJfQs