【Tailwind和訳】GETTING STARTED/Browser Support

この記事について

この記事は、GETTING STARTED/Browser Supportの記事を和訳したものです。

記事内で使用する画像は、公式ドキュメント内の画像を引用して使用させていただいております。

ブラウザサポート

Tailwind がどのブラウザをサポートしているか、またベンダープレフィックスの管理方法を理解することができます。

v2.0 の時点で、Tailwind CSS は Chrome、Firefox、Edge、Safari の最新安定版向けに設計され、テストされています。Tailwind CSS v2.0 は、IE 11 を含む IE のすべてのバージョンをサポートしていません。

IE 11 をサポートする必要がある場合は、依然として優れた、非常に生産性の高いフレームワークである Tailwind CSS v1.9 を使用することをお勧めします。

focus-visibleなどの特定の機能は含まれていますが、すべてのモダンブラウザでネイティブにサポートされているわけではありません。これらの機能のために推奨されるポリフィルについての情報は、その機能自体のドキュメントと一緒に掲載されています。

ベンダープレフィックス

tailwindcss CLI ツールを使って CSS をコンパイルしている場合、ベンダープレフィックスは自動的に追加されます。

そうでない場合は、Autoprefixerを使用することをお勧めします。

使用するには、npm 経由でインストールします。

Terminal

# npmを使う
npm install autoprefixer
# Yarnを使う場合
yarn add autoprefixer

そして、PostCSS の設定で、プラグインリストの一番最後に追加します。

module.exports = {
  plugins: [require("tailwindcss"), require("autoprefixer")],
}