Help:画像の表示
[Wikipedia|▼Menu]
灰色の枠の中に画像と文章を入れることについては「#表示形式」をご覧ください。

オプションのうち、できるだけ付けるようにしたいのはどのような画像なのかを簡潔に表したキャプション(説明文)です。[[ファイル:ファイル名|キャプション]]とします。[[ファイル:Fuji mt s.jpg|本栖湖から眺めた富士山]]

このキャプションは、生成されるXHTMLソースコード中で "a" 要素の "title" 属性と、"img" 要素の "alt" 属性の2つに対して使用されます。この属性はマウスカーソルを乗せたときに表示されるツールチップの文章としても使用されます。

XHTML出力文<a href="/wiki/%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB:Fuji_mt_s.jpg" class="image" title="本栖湖から眺めた富士山"><img alt="本栖湖から眺めた富士山" src="//upload.wikimedia.org/wikipedia/ja/4/41/Fuji_mt_s.jpg" width="431" height="269" data-file-width="431" data-file-height="269" /></a>

alt= により、"img" 要素の "alt" 属性を上記とは別に強制的に指定できます。これは、画像を表示できないブラウザや画像を非表示に設定している場合に画像の代わりに表示したり、音声ブラウザで読み上げたりする代替テキストを指定する属性ですので、(画像の説明ではなく)画像の代替となる言葉であるべきです。インターネット・エクスプローラーなど一部のブラウザではマウスカーソルを乗せたときに表示されるツールチップの文章としても使用されます。[[ファイル:Fuji mt s.jpg|alt=富士山|本栖湖から眺めた富士山]]

XHTML出力文<a href="/wiki/%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB:Fuji_mt_s.jpg" class="image" title="本栖湖から眺めた富士山"><img alt="富士山" src="//upload.wikimedia.org/wikipedia/ja/4/41/Fuji_mt_s.jpg" width="431" height="269" data-file-width="431" data-file-height="269" /></a>

なお、ファイル挿入のマークアップの閉じ括弧の直前にパイプ記号 ("|") を置かないように注意してください。パイプ付きリンクの機能のために、閉じ括弧の直前にパイプ記号があると、指定してあるキャプションは無視され、ファイル名がキャプションとして使用されてしまいます。[[ファイル:tst.png|abc]][[ファイル:tst.png|abc|]]


オプション

キャプションの他に、画像の表示サイズを変えたり表示する位置を決めたり、額縁のように画像の周りに枠をつけたりすることができます。これらのオプションは、縦棒(|)で区切って複数使用できます。順序は自由です。規定されていないオプションはキャプションとして扱われます。複数のキャプションがある場合や rightと left のような矛盾するオプションが同時に使われた場合は、後ろにあるものが優先されます。ただしframeが指定された場合は、指定の順序に関わらず thumb やサイズ指定は無視されます(後述)。
配置指定

画像をページの左右または中央に置きたい場合に指定します。これは同時に文章と画像の位置関係(テキストの回り込みの有無)を決めるものでもあります。right, left, center, none の4種類があります。この中から2つ以上同時に指定された場合は、後ろで指定されたものが優先されます。
right[[ファイル:Toudaiji daibutsuden 1.jpg|right|東大寺大仏殿]]東大寺大仏殿

画像を右寄せして、それに続いて書かれているテキストを、画像の左側に配置します。rightのかわりに右も使えます。

複数の画像を右側に縦1列で並べたいときは下記のように並べるだけでOKです。Template:右などを使う必要はなくなりました。[[ファイル:Toudaiji daibutsuden 1.jpg|right|東大寺大仏殿]][[ファイル:Kinkaku.jpg|right|金閣寺]]
left[[ファイル:Toudaiji daibutsuden 1.jpg|left|東大寺大仏殿]]東大寺大仏殿

画像を左寄せして、それに続いて書かれているテキストを画像の右側に配置します。leftのかわりに左も使えます。
center[[ファイル:Toudaiji daibutsuden 1.jpg|center|東大寺大仏殿]]東大寺大仏殿

画像を中央寄せして、それに続いて書かれているテキストを画像の下側に配置します。
none[[ファイル:Toudaiji daibutsuden 1.jpg|none|東大寺大仏殿]]東大寺大仏殿

画像を左寄せして、それに続いて書かれているテキストを画像の下側に配置します。この場合の none(なし)は、テキストの回り込みをさせないことを意味しています。
指定なし

このオプションを指定しない場合は、画像は文中に挿入されます。一番簡単な方法を参照。Unicodeでは規定されていない文字や記号を文章中で使用したい場合に利用できます。会話ページでこんな感じで使用している人もいますね[[ファイル:Smiley.png|16px|Smiley Face]] 推奨しませんけども。

会話ページでこんな感じで使用している人もいますね 推奨しませんけども。
垂直方向の指定

以下のオプションがそれぞれ指定できます。
baseline
まっかな[[ファイル:Red-square.gif|baseline]]四角形まっかな
四角形
sub
まっかな[[ファイル:Red-square.gif|sub]]四角形まっかな四角形
super
まっかな[[ファイル:Red-square.gif|super]]四角形まっかな四角形
top
まっかな[[ファイル:Red-square.gif|top]]四角形まっかな四角形
text-top
まっかな[[ファイル:Red-square.gif|text-top]]四角形まっかな四角形
middle
デフォルトの状態。まっかな[[ファイル:Red-square.gif|middle]]四角形まっかな四角形
bottom
まっかな[[ファイル:Red-square.gif|bottom]]四角形まっかな四角形
text-bottom
まっかな[[ファイル:Red-square.gif|text-bottom]]四角形まっかな四角形
サイズ指定

表示させたいサイズの横幅をピクセル数で指定します。縦横比を保持したままアップロードされた画像を縮小または拡大して表示します。表示形式にthumbを使うときは、uprightで画像の倍率を指定することもできます。以下ではピクセル数指定の方法について説明します。uprightについてはサイズ指定 (upright)を参照ください。

元の画像よりも小さい値を指定した場合、ブラウザの側で表示サイズを縮小させるのではなく("img" 要素の "width" 属性で指定したときはこのようになります)、MediaWikiがその指定された縮小サイズの画像を自動生成して表示します。これは無駄な送受信を省くための仕組みです。[[ファイル:Kinkaku.jpg|200px]]

[[ファイル:Kinkaku.jpg|100px]]

元の画像よりも大きい値を指定して拡大表示されるのは表示形式用オプションのうち thumb, frame, frameless をつけないときだけです。これらをつけた場合は、元の画像サイズより大きい値を指定しても元の画像サイズのまま表示されます。なお拡大表示される場合、指定サイズの画像は生成せずに元の画像をブラウザ側で引き延ばして表示します。

2つの異なるサイズを指定した場合、後で指定したものが優先されます。[[ファイル:Kinkaku.jpg|50px|200px]]

このオプションを指定しない場合は、アップロードされた画像のサイズそのままで表示されます。
縦横上限値指定

また、幅と高さのそれぞれの上限値を指定する方法もあります。例えば、横幅 300px以下、高さ150px以下と指定する場合、300x150px と指定します。[[ファイル:Kinkaku.jpg|300x150px]]

この画像の場合、元のサイズは横600px、縦450pxですから、幅の指定値300pxに合わせると高さが225pxとなるので条件を満たしません。一方、高さの指定値150pxに合わせると幅は200pxとなるので条件に合います。よって、このように横幅が200px、高さが150pxに縮小されて表示されます。つまり指定した横幅以下、かつ高さ以下で最大になるように、縦横比を変えずに縮小されます。表示される横幅と高さを自由に指定できるわけではありません。縦横比の異なる複数の画像を、同じ大きさの枠内に収まるようにしたいときなどに使用します。

応用として、x150pxのようにすることで高さだけを指定することができます。[[ファイル:Kinkaku.jpg|x200px]]


表示形式

画像の周りに灰色の枠をつけるオプションとしてサムネイル形式(thumb オプション)とフレーム形式(frame オプション)があります。ボーダー方式(border オプション)は画像の周りを細い線で囲みます。 frameless オプションは枠なしのままサムネイル形式と同じサイズを使用することを指定します。
thumb[[ファイル:Tokyotower.jpg|thumb|東京タワーと増上寺本堂]]東京タワーと増上寺本堂

画像をサムネイル形式で表示します。thumbnail と指定しても同じ働きをします。

left、center、none のいずれかが指定されない場合は right を選択した場合と同じになります(右寄せになり、テキストが画像の左側に回り込みます)。したがって、right は省略可能です。そして、画像の下の枠内にキャプションと「拡大」アイコンが表示されます。アイコンにマウスカーソルをのせると、「拡大」と書かれたツールチップが表示されます。拡大アイコンと画像はそれぞれのファイルページにリンクされており、どちらかをクリックすると本来のサイズの画像を見ることができます。

あわせてサイズを指定することで任意の大きさに縮小可能です。サイズ指定がない場合、横幅が220px以下の画像はそのままの大きさで表示されますが、220pxよりも大きい画像は220pxに縮小されます。サイズ指定がないときの横幅の数値は、ログイン利用者ならば個人設定 - 「表示」 - 「ファイル」 - 「サムネイルの大きさ」の設定で変更することができます(既定値は220px)。逆に画像のもとのサイズ以上に拡大表示することはできません。拡大表示したい場合は thumb を外してください。

キャプションにはリンクを入れることもできます。この際は、開き括弧と閉じ括弧の数が一致するように注意してください。[[ファイル:Tokyotower.jpg|thumb|left|100px|[[東京タワー]]と[[増上寺]]本堂]]東京タワー増上寺本堂[[ファイル:Tokyotower.jpg|thumb|left|[[東京タワー|Tokyo Tower]]]]Tokyo Tower

キャプション中のリンクには、パイプ(|)を使ってリンク先の記事と表示される文字を変えることもできます。

複数のサムネイル形式の画像を右側に縦1列で並べたいときは、下記のように並べるだけでOKです。[[ファイル:Tokyotower.jpg|thumb|東京タワーと増上寺本堂]][[ファイル:Tokyotower.jpg|thumb|東京タワーと増上寺本堂]]
サイズ指定 (upright)

thumb形式で画像表示サイズを変更したいときは、上記のようにピクセル数を直接指定することもできますが、uprightオプションで表示サイズを変更することができます。uprightを追加すると、画像の横幅は、サムネイル横幅既定値220px(個人設定を行っている利用者が閲覧している場合はその設定値)の75%の大きさになります。[[ファイル:Tokyotower.jpg|thumb|upright|東京タワーと増上寺本堂]]東京タワーと増上寺本堂

75%よりも大きくまたは小さくしたい場合は、upright=x.xxの書式で好きな倍率を指定できます。既定値・個人設定値の125%にしたい場合はupright=1.25、100%にしたい場合はupright=1、50%にしたい場合はupright=0.5となります。画像のもとのサイズ以上に拡大表示できない点はピクセル数指定と同じです。


次ページ
記事の検索
おまかせリスト
▼オプションを表示
ブックマーク登録
mixiチェック!
Twitterに投稿
オプション/リンク一覧
話題のニュース
列車運行情報
暇つぶしWikipedia

Size:61 KB
出典: フリー百科事典『ウィキペディア(Wikipedia)
担当:undef