Safari 4が対応したCSSの新機能:グラディエント、反転、マスク

エ・ビスコム・テック・ラボ
2009-03-02 19:19:02
  • このエントリーをはてなブックマークに追加

Google Chromeの対応状況

 Safariと同じレンダリングエンジン、WebKitを利用しているGoogle Chromeでは、開発版(バージョン2.0.156.1以上)がグラディエント、反転、マスクの機能に対応している。

 Google Chromeの開発版を利用するには、チャンネルの設定を「Developer preview channel」に変更してアップデートを実行する。ただし、開発版には動作が不安定になるといったリスクがあるので、こうした可能性を承知の上で利用することが必要だ。詳しくは「Early Access Release Channels」を参照してほしい。

 たとえば、先ほどのサンプルをGoogle Chrome(開発版)で表示すると以下のようになる。マスクを利用したサンプルでは、透過されるべき部分が黒色になることがわかる。

Google Chrome(開発版)で表示したもの(画像をクリックすると拡大します) Google Chrome(開発版)で表示したもの(画像をクリックすると拡大します)

 なお、グラディエント、反転、マスクの細かな機能や設定については、次回に紹介したい。

このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]