---
title: display
slug: Web/Manifest/display
tags:
  - Manifest
  - Web
  - display
  - マニフェスト
translation_of: Web/Manifest/display
---
<div>{{QuickLinksWithSubpages("/ja/docs/Web/Manifest")}}</div>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row">型</th>
   <td><code>String</code></td>
  </tr>
  <tr>
   <th scope="row">必須</th>
   <td>いいえ</td>
  </tr>
 </tbody>
</table>

<p><code>display</code> メンバーは、開発者が推奨するウェブサイトの表示モードを判別する文字列です。この表示モードは、ブラウザーの UI をどれだけユーザーに見せるかを変更するものであり、 <code>browser</code> (ブラウザーのウィンドウが完全に見える) から <code>fullscreen</code> (アプリが全画面になる) までの範囲を取ります。</p>

<div class="blockIndicator note">
<p><strong>注:</strong> <code>display</code> メンバーが指定されてなかった場合は、既定で <code>browser</code> になります。</p>
</div>

<div class="blockIndicator note">
<p><strong>注:</strong> 表示モードに応じて選択的に CSS を提供するには、 {{cssxref("@media/display-mode", "display-mode")}} メディア特性を使用することができます。これにより、サイトを URL から起動した場合とデスクトップアイコンから起動した場合とでユーザーの操作に一貫性を持たせることができます。</p>
</div>

<h2 id="値">値</h2>

<p>次の値を使用することができます。</p>

<table class="fullwidth-table standard-table">
 <thead>
  <tr>
   <th scope="col">表示モード</th>
   <th scope="col">解説</th>
   <th scope="col">代替表示モード</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><code>fullscreen</code></td>
   <td>利用可能な画面の領域をすべて使用し、ユーザーエージェントの{{Glossary("chrome", "クローム")}}は表示されなくなります。</td>
   <td><code>standalone</code></td>
  </tr>
  <tr>
   <td><code>standalone</code></td>
   <td>アプリケーションの外見は、単独のアプリケーションのようになります。これは、アプリケーションに別のウィンドウを持たせたり、アプリケーションランチャーに独自のアイコンを追加したりすることができるようになります。このモードでは、ユーザーエージェントはナビゲーションを制御するための UI 要素を除外しますが、ステータスバーなどの他の UI 要素を含めることはできます。</td>
   <td><code>minimal-ui</code></td>
  </tr>
  <tr>
   <td><code>minimal-ui</code></td>
   <td>アプリケーションの外見は、単独のアプリケーションのようになりますが、ナビゲーションを制御するために最小限の UI 要素が表示されます。要素はブラウザーによって異なります。</td>
   <td><code>browser</code></td>
  </tr>
  <tr>
   <td><code>browser</code></td>
   <td>アプリケーションはブラウザーやプラットフォームに応じた一般的なブラウザータブや新しいウインドウで表示されます。これが既定値です。</td>
   <td>(なし)</td>
  </tr>
 </tbody>
</table>

<h2 id="Examples" name="Examples">例</h2>

<pre class="brush: json">"display": "standalone"
</pre>

<h2 id="Specification" name="Specification">仕様書</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">仕様書</th>
   <th scope="col">状態</th>
   <th scope="col">備考</th>
   <th scope="col">フィードバック</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>
    <p>{{SpecName('Manifest', '#display-member', 'display')}}</p>
   </td>
   <td>
    <p>{{Spec2('Manifest')}}</p>
   </td>
   <td>
    <p>初回定義</p>
   </td>
   <td>
    <p><a href="https://github.com/w3c/manifest/issues/">Web App Manifest Working Group drafts</a></p>
   </td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

<div class="blockIndicator note">
<p><strong>注:</strong> Firefox バージョン 47 では、 <code>display</code> の値は <code>browser</code> のみに対応しています。 <code>minimal-ui</code>, <code>standalone</code> , <code>fullscreen</code> は Firefox 57 で追加されました。</p>
</div>

<p>{{Compat("html.manifest.display")}}</p>