テンプレート:Box
 | Luaモジュールを使用しています: |
基本的な使い方
[編集]{{box|内容}} と入力すると次のようになります：
内容
パラメーター
[編集]| パラメーター | 説明 | 出力例 |
|---|---|---|
|type = |
ボックスの種類 | black , white , transparent
|
|span = |
divタグではなくspanタグを使用 | yes |
|wide = |
ページや表の幅いっぱいに広げる | yes
|
|inline = |
インライン表示にする | text text yes text
|
|header = |
任意の見出しを表示 | 見出し
本文 |
|shadow = |
ボックスに影をつける | yes
|
| パラメーター | 説明 | デフォルト | 対応する CSS |
|---|---|---|---|
"content"
|
ボックスの内容（必須） | ||
opt1|background = opt2 |color =
|
ボックスの背景色 | 白 | background-color |
|align =
|
ボックスの配置（left、center、right）（推奨） | left | float |
|padding =
|
ボーダーの内側の余白 | 3px | padding |
|style =
|
ボーダーのスタイル | solid | border-style |
|border color =
|
ボーダーの色 | black | border-color |
|border size =
|
ボーダーの太さ | 3px | border-width |
|text align =
|
テキストの配置（推奨） | left | text-align |
|spacing =
|
文字間のスペース | letter-spacing | |
|font =
|
テキストのフォント | font-family | |
|font size =
|
テキストのサイズ | font-size | |
|text color =
|
テキストの色 | black | text-color |
|margin =
|
ボックスの外側の余白（typeが inline-block または block でない場合は水平方向のみ）
|
3px | margin |
|box type =
|
ボックスのタイプ（inline、inline-block、block） | inline-block | display |
|height =
|
ボックスの高さ | height | |
|width =
|
ボックスの幅 | （テキストの幅） | width |
|CSS =
|
任意の追加 CSS（末尾に ; を忘れずに） |
| パラメーター | 説明 | デフォルト | 対応する CSS |
|---|---|---|---|
|top margin =
|
ボックスの上側の外側余白（typeが inline-block または block でない場合は水平方向のみ）
|
3px | margin-top |
|bottom margin =
|
ボックスの下側の外側余白（同上） | 3px | margin-bottom |
|left margin =
|
ボックスの左側の外側余白（同上） | 3px | margin-left |
|right margin =
|
ボックスの右側の外側余白（同上） | 3px | margin-right |
|top padding =
|
ボーダーの上側の内側余白 | 3px | padding-top |
|bottom padding =
|
ボーダーの下側の内側余白 | 3px | padding-bottom |
|left padding =
|
ボーダーの左側の内側余白 | 3px | padding-left |
|right padding =
|
ボーダーの右側の内側余白 | 3px | padding-right |
|radius =
|
ボックスの角の丸み（ボーダーの半径） | 0 | border-radius |
|max-height =
|
ボックスの最大の高さ | max-height | |
|min-height =
|
ボックスの最小の高さ | min-height | |
|max-width =
|
ボックスの最大の幅 | max-width | |
|min-width =
|
ボックスの最小の幅 | min-width |
例
[編集]A
B
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Curabitur pretium tincidunt lacus. Nulla gravida orci a odio. Nullam varius, turpis et commodo pharetra, est eros bibendum elit, nec luctus magna felis sollicitudin mauris. Integer in mauris eu nibh euismod gravida. Duis ac tellus et risus vulputate vehicula. Donec lobortis risus a elit. Etiam tempor. Ut ullamcorper, ligula eu tempor congue, eros est euismod turpis, id tincidunt sapien risus a quam. Maecenas fermentum consequat mi. Donec fermentum. Pellentesque malesuada nulla a mi. Duis sapien sem, aliquet nec, commodo eget, consequat quis, neque. Aliquam faucibus, elit ut dictum aliquet, felis nisl adipiscing sapien, sed malesuada diam lacus eget erat. Cras mollis scelerisque nunc. Nullam arcu. Aliquam consequat. Curabitur augue lorem, dapibus quis, laoreet et, pretium ac, nisi. Aenean magna nisl, mollis quis, molestie eu, feugiat in, orci. In hac habitasse platea dictumst.C
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
{{box|A|background=red|text color=white}}
{{box|B|background=blue|text color=orange}}
{{box|C|background=black|text color=white|margin=0px|height=1em|width=40px|border color=yellow}}
DOG
{{box|spacing=5px|height=50px|DOG}}
The quick brown fox jumps over the lazy dog
{{box|background=yellow|align=center|border size=10px|radius=20px|text align=center|The quick brown fox jumps over the lazy dog}}
テンプレートデータ
[編集]このテンプレートは、事前定義されたオプションやCSSで装飾されたボックスを生成します。
| パラメーター | 説明 | 型 | 状態 | |
|---|---|---|---|---|
| 1 | 1 | ボックス内に表示する内容。
| 不明 | 推奨 |
| header | header | ボックスの見出し。
| 不明 | 推奨 |
| align | align | ボックスの配置（左寄せ、中央、右寄せなど）。
| 不明 | 推奨 |
| box type | box type | ボックスの表示形式（CSSのdisplay）: block、inline-block、inline。
| 不明 | 省略可能 |
| wide | wide | yesを指定するとボックスがページ幅いっぱいに広がります。
| ブール値 | 省略可能 |
| inline | inline | yesでボックスをインライン表示にします。
| ブール値 | 省略可能 |
| style | style | ボーダーのスタイル。
| 不明 | 省略可能 |
| padding | padding | ボックス内側の余白（パディング）。
| 不明 | 省略可能 |
| top padding | top padding | ボックス上部のパディング。 | 不明 | 省略可能 |
| bottom padding | bottom padding | ボックス下部のパディング。 | 不明 | 省略可能 |
| left padding | left padding | ボックス左側のパディング。 | 不明 | 省略可能 |
| right padding | right padding | ボックス右側のパディング。 | 不明 | 省略可能 |
| border color | border color | ボックスのボーダー（枠）の色。
| 文字列 | 省略可能 |
| radius | radius | 角の丸み（ボーダー半径）。
| 不明 | 省略可能 |
| type | type | ボックスの種類（black、white、transparent）。
| 不明 | 省略可能 |
| border size | border size | ボーダーの太さ。
| 不明 | 省略可能 |
| color | color background | 背景色。
| 不明 | 省略可能 |
| text color | text color | テキストの色。
| 不明 | 省略可能 |
| text align | text align | テキストの配置（CSSのtext-align）。
| 不明 | 省略可能 |
| spacing | spacing | 文字間のスペース。 | 不明 | 省略可能 |
| font | font | フォントファミリー（例：serif、sans-serifなど）。 | 不明 | 省略可能 |
| font size | font size text size | テキストのサイズ。 | 不明 | 省略可能 |
| margin | margin | ボックスの外側の余白（マージン）。
| 不明 | 省略可能 |
| top margin | top margin | ボックスの上部マージン。 | 不明 | 省略可能 |
| bottom margin | bottom margin | ボックスの下部マージン。 | 不明 | 省略可能 |
| left margin | left margin | ボックスの左側マージン。 | 不明 | 省略可能 |
| right margin | right margin | ボックスの右側マージン。 | 不明 | 省略可能 |
| height | height | ボックスの高さ。
| 不明 | 省略可能 |
| max-height | max-height | ボックスの最大高さ。
| 不明 | 省略可能 |
| min-height | min-height | ボックスの最小高さ。
| 不明 | 省略可能 |
| width | width | ボックスの幅。
| 不明 | 省略可能 |
| max-width | max-width | ボックスの最大幅。 | 不明 | 省略可能 |
| min-width | min-width | ボックスの最小幅。 | 不明 | 省略可能 |
| CSS | CSS | 追加で適用したい任意のCSS（;を忘れずに）。 | 不明 | 省略可能 |