---
title: HTML インポート
slug: Web/Web_Components/HTML_Imports
translation_of: Web/Web_Components/HTML_Imports
---
<p>{{DefaultAPISidebar("Web Components")}}</p>

<div class="blockIndicator obsolete">
<p><strong>Google Chrome 73 で廃止</strong><br>
 この機能は廃止されました。まだいくつかのブラウザーで動作するかもしれませんが、いつ削除されてもおかしくないので、使わないようにしましょう。</p>
</div>

<div class="blockIndicator warning">
<p>Firefox はこの形式の <em>HTML インポート</em> は提供していません。詳細は<a href="https://hacks.mozilla.org/2015/06/the-state-of-web-components/">状況更新</a>を参照してください。標準化への同意が集まるか、代替機構が発表されるまで、Google の <code><a href="https://github.com/webcomponents/webcomponentsjs">webcomponents.js</a></code> などのポリフィルを使用することができます。</p>
</div>

<p><em>HTML インポート</em> は <a href="/ja/docs/Web/Web_Components">Web Components</a> のパッケージング機構として使用されることを意図していますが、単独で使用することもできます。</p>

<p>以下のように、HTML 文書中で <a href="/ja/docs/Web/HTML/Element/link"><code>&lt;link&gt;</code></a> タグを使用してインポートします。</p>

<pre>&lt;link rel="import" href="myfile.html"&gt;</pre>

<p>リンク種別 <code>import</code> は新設です。</p>

<h2 id="仕様">仕様</h2>

<table class="spec-table standard-table">
 <tbody>
  <tr>
   <th scope="col">仕様</th>
   <th scope="col">状態</th>
   <th scope="col">備考</th>
  </tr>
  <tr>
   <td>{{SpecName("HTML Imports")}}</td>
   <td>{{Spec2("HTML Imports")}}</td>
   <td>初回定義。</td>
  </tr>
 </tbody>
</table>

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

<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>

<p>{{Compat("html.elements.link.rel.import")}}</p>