CSS3のベンダープレフィックスを見直す

備忘録。WEB制作でよく使うCSS3のベンダープレフィックスについてまとめました。
モダンブラウザは最新版であることが前提です。

スポンサーリンク
レクタングル大

boder-radius

モダンブラウザはすでにサポート済み。
IE9+。
スマホもOK。

box-shadow

-webkitはAndroid3.0以前対応。
モダンブラウザはサポート済み。
IE9+。

linear-gradient

-webkit-gradientは当初webkitで使われていた構文。最近SafariとiOSが新しくしたので念のため。
-webkit-linear-gradientはAndroid3.0以前対応。
モダンブラウザはサポート済み。
IE10+。

ベンダープレフィックスの整理整頓

CSS3 PIE

IE8以下(liner-gradientはIE9以下)で使いたかったらCSS3 PIEあたりで。

JavaScriptを使いIE6〜8でCSS3の表示を可能にするもの。
CSS3 PIEでファイルをダウンロードしてきたら解凍して「PIE.htc」を表示させたいサイトのディレクトリに配置。

beheviorプロパティを使用して上記のように記述。
必ず絶対パスで。

下記CSS3に適用可。

  • border-radius
  • box-shadow
  • border-image
  • multiple background images
  • linear-gradient as background image
スポンサーリンク
レクタングル大
レクタングル大

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください