「Template:Vertical images list」の版間の差分
表示
削除された内容 追加された内容
Fryed-peach (会話 | 投稿記録) m編集の要約なし |
Frozen-mikan (会話 | 投稿記録) モバイル版で発生する回り込みを阻止: 内枠のfloat指定を解除。外枠の幅指定を解除。{{{枠幅}}}の指定先を外枠から説明枠に変更。説明枠の左右paddingを0に。 |
||
1行目: | 1行目: | ||
<includeonly><div class="thumb {{#switch:{{{寄せ|}}}|左|left=tleft|#default=tright}}" style="width:{{#if:{{{枠幅|}}}|{{{枠幅}}}|{{{幅|200px}}}}}; margin:{{#switch:{{{寄せ|}}}|左|left= 0 1.5em 0 0;|#default= 0 3px 0 1em;}}"> |
<includeonly><div class="thumb {{#switch:{{{寄せ|}}}|左|left=tleft|#default=tright}}" style="<!-- width:{{#if:{{{枠幅|}}}|{{{枠幅}}}|{{{幅|200px}}}}}; -->margin:{{#switch:{{{寄せ|}}}|左|left= 0 1.5em 0 0;|#default= 0 3px 0 1em;}}"> |
||
<div class="thumbinner" style="float:{{#switch:{{{寄せ|}}}|左|left=left|#default=right}}"> |
<div class="thumbinner" style="<!-- float:{{#switch:{{{寄せ|}}}|左|left=left|#default=right}} -->"> |
||
{{#if:{{{画像1|{{{1|}}}}}} |
{{#if:{{{画像1|{{{1|}}}}}} |
||
|<div class="thumbimage" style="margin: 0; padding: 0;">[[ファイル:{{{画像1|{{{1|}}}}}}|{{{幅|200px}}}|{{{説明1|{{{2|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: 0; padding: 0;">[[ファイル:{{{画像1|{{{1|}}}}}}|{{{幅|200px}}}|{{{説明1|{{{2|}}}}}}]]</div> |
||
|}}{{#if:{{{説明1|{{{2|}}}}}} |
|}}{{#if:{{{説明1|{{{2|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明1|{{{2|}}}}}}</div> |
||
|}}{{#if:{{{画像2|{{{3|}}}}}} |
|}}{{#if:{{{画像2|{{{3|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明1|{{{2|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像2|{{{3|}}}}}}|{{{幅|200px}}}|{{{説明2|{{{4|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明1|{{{2|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像2|{{{3|}}}}}}|{{{幅|200px}}}|{{{説明2|{{{4|}}}}}}]]</div> |
||
|}}{{#if:{{{説明2|{{{4|}}}}}} |
|}}{{#if:{{{説明2|{{{4|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明2|{{{4|}}}}}}</div> |
||
|}}{{#if:{{{画像3|{{{5|}}}}}} |
|}}{{#if:{{{画像3|{{{5|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明2|{{{4|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像3|{{{5|}}}}}}|{{{幅|200px}}}|{{{説明3|{{{6|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明2|{{{4|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像3|{{{5|}}}}}}|{{{幅|200px}}}|{{{説明3|{{{6|}}}}}}]]</div> |
||
|}}{{#if:{{{説明3|{{{6|}}}}}} |
|}}{{#if:{{{説明3|{{{6|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明3|{{{6|}}}}}}</div> |
||
|}}{{#if:{{{画像4|{{{7|}}}}}} |
|}}{{#if:{{{画像4|{{{7|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明3|{{{6|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像4|{{{7|}}}}}}|{{{幅|200px}}}|{{{説明4|{{{8|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明3|{{{6|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像4|{{{7|}}}}}}|{{{幅|200px}}}|{{{説明4|{{{8|}}}}}}]]</div> |
||
|}}{{#if:{{{説明4|{{{8|}}}}}} |
|}}{{#if:{{{説明4|{{{8|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明4|{{{8|}}}}}}</div> |
||
|}}{{#if:{{{画像5|{{{9|}}}}}} |
|}}{{#if:{{{画像5|{{{9|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明4|{{{8|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像5|{{{9|}}}}}}|{{{幅|200px}}}|{{{説明5|{{{10|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明4|{{{8|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像5|{{{9|}}}}}}|{{{幅|200px}}}|{{{説明5|{{{10|}}}}}}]]</div> |
||
|}}{{#if:{{{説明5|{{{10|}}}}}} |
|}}{{#if:{{{説明5|{{{10|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明5|{{{10|}}}}}}</div> |
||
|}}{{#if:{{{画像6|{{{11|}}}}}} |
|}}{{#if:{{{画像6|{{{11|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明5|{{{10|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像6|{{{11|}}}}}}|{{{幅|200px}}}|{{{説明6|{{{12|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明5|{{{10|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像6|{{{11|}}}}}}|{{{幅|200px}}}|{{{説明6|{{{12|}}}}}}]]</div> |
||
|}}{{#if:{{{説明6|{{{12|}}}}}} |
|}}{{#if:{{{説明6|{{{12|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明6|{{{12|}}}}}}</div> |
||
|}}{{#if:{{{画像7|{{{13|}}}}}} |
|}}{{#if:{{{画像7|{{{13|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明6|{{{12|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像7|{{{13|}}}}}}|{{{幅|200px}}}|{{{説明7|{{{14|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明6|{{{12|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像7|{{{13|}}}}}}|{{{幅|200px}}}|{{{説明7|{{{14|}}}}}}]]</div> |
||
|}}{{#if:{{{説明7|{{{14|}}}}}} |
|}}{{#if:{{{説明7|{{{14|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明7|{{{14|}}}}}}</div> |
||
|}}{{#if:{{{画像8|{{{15|}}}}}} |
|}}{{#if:{{{画像8|{{{15|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明7|{{{14|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像8|{{{15|}}}}}}|{{{幅|200px}}}|{{{説明8|{{{16|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明7|{{{14|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像8|{{{15|}}}}}}|{{{幅|200px}}}|{{{説明8|{{{16|}}}}}}]]</div> |
||
|}}{{#if:{{{説明8|{{{16|}}}}}} |
|}}{{#if:{{{説明8|{{{16|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明8|{{{16|}}}}}}</div> |
||
|}}{{#if:{{{画像9|{{{17|}}}}}} |
|}}{{#if:{{{画像9|{{{17|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明8|{{{16|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像9|{{{17|}}}}}}|{{{幅|200px}}}|{{{説明9|{{{18|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明8|{{{16|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像9|{{{17|}}}}}}|{{{幅|200px}}}|{{{説明9|{{{18|}}}}}}]]</div> |
||
|}}{{#if:{{{説明9|{{{18|}}}}}} |
|}}{{#if:{{{説明9|{{{18|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明9|{{{18|}}}}}}</div> |
||
|}}{{#if:{{{画像10|{{{19|}}}}}} |
|}}{{#if:{{{画像10|{{{19|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明9|{{{18|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像10|{{{19|}}}}}}|{{{幅|200px}}}|{{{説明10|{{{20|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明9|{{{18|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像10|{{{19|}}}}}}|{{{幅|200px}}}|{{{説明10|{{{20|}}}}}}]]</div> |
||
|}}{{#if:{{{説明10|{{{20|}}}}}} |
|}}{{#if:{{{説明10|{{{20|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明10|{{{20|}}}}}}</div> |
||
|}}{{#if:{{{画像11|{{{21|}}}}}} |
|}}{{#if:{{{画像11|{{{21|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明10|{{{20|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像11|{{{21|}}}}}}|{{{幅|200px}}}|{{{説明11|{{{22|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明10|{{{20|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像11|{{{21|}}}}}}|{{{幅|200px}}}|{{{説明11|{{{22|}}}}}}]]</div> |
||
|}}{{#if:{{{説明11|{{{22|}}}}}} |
|}}{{#if:{{{説明11|{{{22|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明11|{{{22|}}}}}}</div> |
||
|}}{{#if:{{{画像12|{{{23|}}}}}} |
|}}{{#if:{{{画像12|{{{23|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明11|{{{22|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像12|{{{23|}}}}}}|{{{幅|200px}}}|{{{説明12|{{{24|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明11|{{{22|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像12|{{{23|}}}}}}|{{{幅|200px}}}|{{{説明12|{{{24|}}}}}}]]</div> |
||
|}}{{#if:{{{説明12|{{{24|}}}}}} |
|}}{{#if:{{{説明12|{{{24|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明12|{{{24|}}}}}}</div> |
||
|}}{{#if:{{{画像13|{{{25|}}}}}} |
|}}{{#if:{{{画像13|{{{25|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明12|{{{24|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像13|{{{25|}}}}}}|{{{幅|200px}}}|{{{説明13|{{{26|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明12|{{{24|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像13|{{{25|}}}}}}|{{{幅|200px}}}|{{{説明13|{{{26|}}}}}}]]</div> |
||
|}}{{#if:{{{説明13|{{{26|}}}}}} |
|}}{{#if:{{{説明13|{{{26|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明13|{{{26|}}}}}}</div> |
||
|}}{{#if:{{{画像14|{{{27|}}}}}} |
|}}{{#if:{{{画像14|{{{27|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明13|{{{26|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像14|{{{27|}}}}}}|{{{幅|200px}}}|{{{説明14|{{{28|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明13|{{{26|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像14|{{{27|}}}}}}|{{{幅|200px}}}|{{{説明14|{{{28|}}}}}}]]</div> |
||
|}}{{#if:{{{説明14|{{{28|}}}}}} |
|}}{{#if:{{{説明14|{{{28|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明14|{{{28|}}}}}}</div> |
||
|}}{{#if:{{{画像15|{{{29|}}}}}} |
|}}{{#if:{{{画像15|{{{29|}}}}}} |
||
|<div class="thumbimage" style="margin: {{#if:{{{説明14|{{{28|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像15|{{{29|}}}}}}|{{{幅|200px}}}|{{{説明15|{{{30|}}}}}}]]</div> |
|<div class="thumbimage" style="margin: {{#if:{{{説明14|{{{28|}}}}}}|0|3px 0 0}}; padding: 0;">[[ファイル:{{{画像15|{{{29|}}}}}}|{{{幅|200px}}}|{{{説明15|{{{30|}}}}}}]]</div> |
||
|}}{{#if:{{{説明15|{{{30|}}}}}} |
|}}{{#if:{{{説明15|{{{30|}}}}}} |
||
|<div class="thumbcaption" style="padding |
|<div class="thumbcaption" style="width: {{#if:{{{枠幅|}}}|{{{枠幅}}}}}; padding: 1px 0 3px; line-height: 1.1em; font-size: 0.9em;">{{{説明15|{{{30|}}}}}}</div> |
||
|}}</div></div></includeonly><noinclude> |
|}}</div></div></includeonly><noinclude> |
||
{{Documentation}} |
{{Documentation}} |
2014年10月11日 (土) 14:32時点における版
- 画像の右、若しくは左への縦並べ表示テンプレート。
- キャプション付きの場合、[[画像:|thumb]]の羅列や{{|右}}での表示方法より縦の長さが節約出来ます。
- 画像は最大15枚まで、画像が長過ぎる場合は「幅 = 200x250px」等して下さい→参照:#画像縦サイズ指定について、Help:画像の表示#縦横上限値指定。
- 以下ソース2例。どちらを使用しても差はありません。不要項は省略可。
{{Vertical_images_list |寄せ = 左(未記入でデフォルト右寄せ) |幅 = px(未記入でデフォルト200px) |枠幅 = px(表示画像サイズと枠の横幅が揃わない際に使用) |1 = 画像名 |2 = 説明 |3 = 画像名 |4 = 説明 |5 = 画像名 |6 = 説明 |7 = 画像名 |8 = 説明 |9 = 画像名 |10 = 説明 |11 = 画像名 |12 = 説明 |13 = 画像名 |14 = 説明 |15 = 画像名 |16 = 説明 |17 = 画像名 |18 = 説明 |19 = 画像名 |20 = 説明 |21 = 画像名 |22 = 説明 |23 = 画像名 |24 = 説明 |25 = 画像名 |26 = 説明 |27 = 画像名 |28 = 説明 |29 = 画像名 |30 = 説明 }}
{{Vertical_images_list |寄せ = 左(未記入でデフォルト右寄せ) |幅 = px(未記入でデフォルト200px) |枠幅 = px(表示画像サイズと枠の横幅が揃わない際に使用) |画像1 = |説明1 = |画像2 = |説明2 = |画像3 = |説明3 = |画像4 = |説明4 = |画像5 = |説明5 = |画像6 = |説明6 = |画像7 = |説明7 = |画像8 = |説明8 = |画像9 = |説明9 = |画像10 = |説明10 = |画像11 = |説明11 = |画像12 = |説明12 = |画像13 = |説明13 = |画像14 = |説明14 = |画像15 = |説明15 = }}
使用例
- デフォルトは右寄せ、幅200px表示。
{{Vertical_images_list |1 = A girl in a swimming pool - underwater.jpg |3 = African waterfall.jpg |4 = 生命のみなもと }}
- 幅任意設定、左寄せする際は「寄せ = 左」「幅 = ○○px」それぞれ入力。
{{Vertical_images_list |寄せ = 左 |幅 = 80px |画像1 = Ferrari Enzo Concours.jpg |説明1 = [[エンツォ・フェラーリ (自動車)|エンツォ]] |画像2 = Enzo rear.JPG |説明2 = リア |画像3 = Ferrari Enzo Ferrari tail.jpg |説明3 = テールランプ |画像4 = Ferrari P45 front right crop.jpg |説明4 = P4/5(第二案) |画像5 = Ferrari_FXX.jpg |説明5 = FXX }}
注意事項
画像縦サイズ指定について
- 表示画像の縦サイズを揃える場合は「
|幅 = (横幅)x(高さ)px
」と指定します。この指定により、横長・縦長のどちらの画像でも、横幅・高さが指定された数値を上限にして自動的にサイズ調整・表示されます。 - ただしキャプション(
|説明1~10 =
)の文面が長い場合、下例のようにキャプションの長さに従い枠の横幅が広く取られてしまう場合があります。
{{Vertical_images_list |幅 = 100x100px |画像1 = Kinkaku.jpg |説明1 = 通称「金閣寺」の由来となった金閣は、漆地に金箔を押した三層の建物で正式には舎利殿と称する。 }}
- このような場合は、下例のように「
|枠幅 = (画像サイズの横幅)px
」を使い枠幅のみ別指定する必要があります。
{{Vertical_images_list |幅 = 100x100px |枠幅 = 100px <-----枠幅のみ追加指定 |画像1 = Kinkaku.jpg |説明1 = 通称「金閣寺」の由来となった金閣は、漆地に金箔を押した三層の建物で正式には舎利殿と称する。 }}
- 注)「
|枠幅 =
」では高さ指定は不可、画像サイズと枠幅が揃っていないと表示が崩れる場合があります。