Basic Syntax - Group

このページでは KARAS のグループ構文について説明します。

インライングループ
ブロックグループ

インライングループ

インライングループ構文は、ある文章や単語をグループにするための構文です。 (言い換えれば span 要素によって閉じるための構文です。) テキストを << と >> によって閉じると、インライングループになります。オプションを指定しないときは、空のグループが作成されます。

Input

<<group>> text.

Output

<span class="group"></span> text.

インライングループはオプションの構文 :: を使ってテキストを追加することができます。インライングループ構文の最大レベルは2です。レベル1では class グループとして出力されます。レベル2では id グループとして出力されます。ふつうは、必ずグループ名を付け、 id はあるドキュメントの中で一意に定められるべきです。

Input

<<group::Sample>> text.
<<<group::Sample>>> text.

Output

<span class="group">Sample</span> text.
<span id="group">Sample</span> text.

ブロックグループ

ブロックグループ構文は、見出し・リスト・テーブル・テキストなどのあらゆる要素をグループにするための構文です。 (言い換えれば、 div 要素によって閉じるための構文です。) 行頭に {{ を書くとグループの開始位置となります。行頭に }} を書くとグループの終了位置となります。グループの開始位置と終了位置の間にある見出しやテキストがグループとなります。

Input

{{
 = Heading
 
 Some paragraphs. 
 
 - Some lists.
 -- 2nd item.
}}

Output

<div>
<h1>Heading</h1>
<p>Some paragraphs</p>
<ul>
<li> Some lists.
<ul><li>2nd item.</li></ul>
</li>
</ul>
</div>

名前付きのグループ

グループには名前をつけることができます。グループの開始位置を表す構文 {{ に続いて書かれたテキストは、グループの名前となります。 (言い換えれば div 要素のクラス名となります。) グループ名は改行することができない点に注意してください。

Input

{{groupname
Contents in group.
}}

Output

<div class="groupname">
<p>Contents in group.</p>
</div>

特別なグループ

次のいくつかの名前は、グループ名として使うことができません。それらの名前をつけるとき、グループは特別なグループになります。

言い換えれば、その名前の HTML 要素になります。グループが示す内容についての詳細が必要なときは、 HTML に関するドキュメントを読むことを推奨します。

div	特別な意味を持たないグループ。
header	あるドキュメントのヘッダを表すグループ。
footer	あるドキュメントのフッタを表すグループ。
nav	メニューや構成などを表すグループ。
article	まとまった記事であることを示すグループ
section	ある内容のまとまりであることを示すグループ。
aside	本題とは異なる内容であることを示すグループ。
address	あるコンテンツの著者に関する情報を示すグループ。
details	追加の情報を表すグループ。
figure	図表を表すグループ。
pre	整形済みの内容を表すグループ。
code	ソースコードやパスなどを表すグループ。
kbd	ユーザのあらゆる入力を表すグループ。
samp	コンピュータなどの出力結果を表すグループ。

例えば、 "header" という名前が付けられたグループは、 header 要素として出力されます。

Input

{{header
Contents in header.
}}

Output

<header>
Contents in header.
</header>

header にグループ名をつけるときはオプションのための記号 :: を書いて、後に続けてグループ名を書きます。

Input

{{header::groupname
Contents in header.
}}

Output

<header class="groupname">
Contents in header.
</header>

div グループに "header" という名前 (クラス名) をつけるときは、グループ名を "div" として、オプションとして "header" を追加します。

Input

{{div::header
Contents in div group.
}}

Output

<div class="header">
Contents in div group.
</div>

figure, details グループ

figure と details グループは、特別な機能を持っています。 figure グループ内に書かれた見出しの構文 = は、 figcaption (図の見出し)として出力されます。見出しの構文を書く位置は、 figure グループ内のどこでも良いです。しかしながら、一般には、 figure グループの一番上か一番下に書きます。

Input

{{figure
= Caption text.

!|table head || table item
!|table head || table item
}}

Output

<figure>
<figcaption>Caption text.</figcaption>
<table>
<tr><th>table head</th><td>table item</td></tr>
<tr><th>table head</th><td>table item</td></tr>
</table> 
</figure>

detalis グループ内に書かれた見出しの構文 = は summary (要約)として出力されます。見出しの構文を書く位置は、 details グループ内のどこでも良いです。しかしながら、一般には、 details グループの一番上に書きます。

Input

{{details
= Summary text.
 
;detail-1
;;More detail.
;detail-2
;;more detail.
}}

Output

<details>
<summary>Summary text.</summary>
<dl>
<dt>detail-1</dt>
<dd>More details.</dd>
<dt>detail-2</dt>
<dd>More details.</dd>
</dl>
</details>

pre, code, kbd, samp グループ

pre, code, kbd, samp グループは、特別な機能を持つグループです。これらのグループ内にあるテキストは、改行するための構文 ~ を使わなくても、そのまま改行されます。また、テキストに含まれる KARAS の構文は変換されず、 < や > などの特定の文字は文字参照に変換されます。

Input

{{pre
Preformatted text.
2nd line.
<tag>Text in tag.</tag>
}}

Output

<pre>
Preformatted text.
2nd line.
&lt;tag&gt;Text in tag.&lt;/tag&gt;
</pre>

code, kbd, samp グループの出力は、 pre グループ(要素)が合わせて出力されます。オプションで追加したグループ名 (class名) は、 pre と code (kbd, samp) の両方に追加されます。

Input

{{code :: lang-c
int main()
{
    printf("Unyalder!");
    return 0;
}
}}
 
{{samp :: terminal
$echo Unyalder!
Unyalder!
}}

Output

<pre class="lang-c">
<code class="lang-c">
int main()
{
    printf("Unyalder!");
    return 0;
}
</code>
</pre>

<pre class="terminal">
<samp class="terminal">
$echo Unyalder!
Unyalder!
</samp>
</pre>