CSS3

1、CSS3 とは

CSS3 は CSS2 のアップグレード版であり、CSS2.1 に基づいて多くの強力な新機能が追加されています。現在、主流のブラウザである chrome、safari、firefox、opera、さらには 360 も CSS3 のほとんどの機能をサポートしており、IE10 も CSS3 を完全にサポートし始めます。

CSS3 スタイルを記述する場合、ブラウザごとに異なるプレフィックスが必要になる場合があります。これは、CSS プロパティまたはルールがまだ W3C 標準の一部になっておらず、ブラウザーのプライベート プロパティであることを意味します。ただし、ブラウザーの新しいバージョンでは現在プレフィックスは必要ありませんが、前方互換性を高めるためにプレフィックスは依然として不可欠です

2。 . CSS3では何ができるのでしょうか？

CSS3 は私たちにどのようなメリットをもたらしますか?簡単に言えば、CSS3 は、これまで画像やスクリプトを使用する必要があった効果、さらにはアニメーション効果を、わずか数行のコードで実現できます。丸い角、画像の境界線、テキストの影とボックスの影、トランジション、アニメーションなど。

CSS3 は、フロントエンド開発者の設計プロセスを簡素化し、ページの読み込みを高速化します。

CSS3 の強力な機能とは何ですか?皆さん、まず見てみましょう

セレクター 以前は、HTML 要素を選択するために通常、クラス、ID、またはタグ名を使用していましたが、CSS3 セレクターは非常に強力です。タグ内のクラスと ID の数が減り、スタイル シートの管理が容易になり、面倒な要素を簡単にまとめることができるようになりました

。

ブロックシャドウとテキストシャドウ

任意の DIV とテキストにシャドウ効果を追加できます

カラー

CSS3 は、より多くの色と広範な色の定義をサポートしています。新しいカラー CSS3 は HSL、CMYK、HSLA、RGBA をサポートします

グラデーション効果

これまで Photoshop でしか作れなかった画像のグラデーション効果を CSS で記述できるようになり、IE でのフィルターも実現できます

パーソナライズされたフォント

Web ページ上のフォントが単一すぎませんか? @Font-Face を使用してフォントを簡単にカスタマイズ

複数の背景画像

1 つの要素に複数の背景画像を追加

境界線の背景画像

境界線のアプリケーションの背景画像

変換処理

あなたHTML 要素は、回転、拡大縮小、傾斜、移動が可能で、以前は JavaScript でのみ可能であった強力なアニメーションさえも可能です


複数列レイアウト

を使用すると、複数の div タグを使用せずに複数列レイアウトを実現できます。

メディアクエリ

異なる画面解像度に異なるスタイルを適用

など。 。 CSS3 はコードをよりシンプルかつ効率的にします。作業効率を大幅に向上させ、より高度なユーザー エクスペリエンスを生み出し、Web アプリケーションのインターフェイス デザインを新たなレベルに引き上げることができます。