[CSS]CSS3を使って、より美しいスタイルを適用するチュートリアル

CSS3の角丸やシャドウ、グラデーションを使用して、より美しくスタイルを適用するチュートリアルをAbduzeedoから紹介します。

デモのキャプチャ

Playing with CSS3
demo
キャプチャはChrome3

CSS3に対応しているブラウザでは上記のように、角丸やシャドウ、グラデーションのスタイルが適用され、美しいレイアウトが再現されます。
完全に対応していないブラウザでは下記のようになります。

デモのキャプチャ

キャプチャはFirefox3.5

チュートリアルでは「box-shadow」のエフェクトから一つずつCSS3のテクニックが紹介されており、全部を使用するだけでなく、部分的に使用したい場合にも参考になると思います。

チュートリアルのキャプチャ

box-shadow

チュートリアルのキャプチャ

border-radiusとtext-shadow

チュートリアルのキャプチャ

gradient

sponsors

top of page

©2018 coliss