Wikipedia:画像の表示
[Wikipedia|▼Menu]
.mw-parser-output .module-shortcutboxplain{float:right;border:1px solid #aaa;background:#fff;margin:0 0 0 1em;padding:0.3em 0.6em 0.2em 0.6em;text-align:center;font-size:85%;font-weight:bold}.mw-parser-output .module-shortcutlist{display:inline-block;border-bottom:1px solid #aaa;margin-bottom:0.2em;font-weight:normal}.mw-parser-output .module-shortcutanchordiv{position:relative;top:-3em}ショートカット:

H:PICTURE


ようこそ

ガイドブック

チュートリアル

早見表

用語集

FAQ

ヘルプ

利用案内

質問

ウィキペディア日本語版のヘルプページです。

編集用ヘルプ目次
編集の基本
ページの編集
新規ページの作成
記事名チェック
文書の体裁
セクションと目次
箇条書き / 表の作り方
脚注 / ISBNのリンク
特殊文字
HTMLタグの使用
画像の表示
画像などの利用
ファイルページ
数式の書き方
リンクする
リンク / URL
パイプ付きリンク
言語間・ウィキ間リンク
ウィキデータ
カテゴリ
リダイレクトソフト
ページの位置づけ
名前空間
サブページ
ミスなどの修正
新規ページの巡回
以前の版にページを戻す方法
ページの移動
作業の効率化
マジックワード
テンプレート早わかり
テンプレートの制限
条件文 / テンプレートの説明文
ナビゲーションボックス
コミュニケーション
要約欄
細部の編集
ノートページ / 過去ログ
ウィキラブ
ウィキメール / 感謝
その他
編集の競合
ページ名の働き
記事の定義
ページサイズ
音声・動画の作成と利用
棒グラフの書き方
サンドボックス
ウィキポータル

各ページにて画像を表示させる方法について説明します。そのためのマークアップの仕方や、また各種の引数の指定による表示の変化を説明します。表示できる画像は、ウィキペディア日本語版またはウィキメディア・コモンズに既にアップロードされた画像のみです。アップロードの方法などについては「Help:画像などのファイルのアップロードと利用」を参照してください。

どのような場合にどのような表示方法をとるべきかについては「Wikipedia:画像利用の方針#配置」を参照してください。
編集ツールバーによる入力

編集ツールバーによって入力を補助でき、ファイル名さえわかっていれば複雑なマークアップを覚える必要ありません。「埋め込みファイル」を押し、ファイル名や説明書きをキャプションに入力し、位置などを決定し「ファイル挿入」を押します。サイズ、配置、形式などについては以降の要点などを理解したほうが、うまく表示できるでしょう。

「上級」から複数の画像を表示する「ギャラリー」も選択できます。詳細は本文書の#ギャラリーです。これも理解しておいた方がうまく表示できるでしょう。
要点

ウィキペディアでは、XHTML (HTML) について知らない人にも画像を扱うことができるように独自の簡単なマークアップを採用しています。その代わり、XHTMLのIMGタグは無効化されています。

書式:[[ファイル:ファイル名|オプション]] (内部リンクのマークアップと同じ)

プレフィックスはFileでも機能します([[File:ファイル名|オプション]] )。

オプションは、縦棒(|)で区切って複数指定可能です。順序は不問ですが、矛盾するものを同時に指定した場合は原則として後ろにあるものが優先されます。指定できるオプションの種類をまとめると [[ファイル:{ファイル名}|{表示形式}|{配置}|{サイズ}|{画像リンク}|{キャプション}|{代替文}]]のようになります。
表示形式
thumb, frame, border または frameless が指定できます。画像を決まった表示形式で表示します。
配置
right, left, center または none が指定できます。ページ中の画像の配置位置を指定します。 thumb または frame を用いている時には、 right が既定値です。このほか、垂直方向の配置も指定できます。
サイズ
{幅}px または {幅}x{高さ}px で指定します。画像の縦横比は保持されます。表示形式にthumbを使うときは、uprightで画像の倍率を指定することもできます。
画像リンク
画像からリンクするページを指定します。
キャプション
上記のいずれかに当てはまらない要素はすべてキャプション用の文字列と認識されます。
代替文
読み上げブラウザなどのための代替文をキャプションとは別指定する際に使用します。
開始ページ指定
DjVuファイルの場合、 page="ページ番号"で開始ページを指定できます。
言語指定
多言語対応SVGファイルにおいて lang="言語コード(小文字)"で図中の表示文字の言語を指定できます。

ウィキメディア・コモンズにあるファイルを表示するときも、日本語版にあるファイルを表示するときと同じ書き方が使用できます。コモンズからウィキペディアに表示されている画像はファイルページにその旨が自動的に表示されます。
一番簡単な方法

最も簡単な方法は[[ファイル:ファイル名]]と記述するものです。この場合、アップロードされた画像のサイズのまま表示されます。また表示される位置は、通常の文字と同じようにテキストの中に挿入された形で表示されます。[[ファイル:Fuji mt s.jpg]]文章の先頭に置いた場合はこのように表示されます。なおこの例のように、編集画面での改行1つは無視されて、1文として扱われます。

文章の先頭に置いた場合はこのように表示されます。なおこの例のように、編集画面での改行1つは無視されて、1文として扱われます。文章で挿むと[[ファイル:Fuji mt s.jpg]]このように表示されます。

文章で挿むとこのように表示されます。

ファイル名では、アルファベットの大文字と小文字が区別されます。一方、半角の空白はアンダーバー(_)を使っても同一のものと扱われます。
キャプションをつける.mw-parser-output .hatnote{margin:0.5em 0;padding:3px 2em;background-color:transparent;border-bottom:1px solid #a2a9b1;font-size:90%}

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

オプションのうち、できるだけ付けるようにしたいのはどのような画像なのかを簡潔に表したキャプション(説明文)です。[[ファイル:ファイル名|キャプション]]とします。[[ファイル: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 と指定します。


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

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