CSSとCSS3の違い

元のカスケードスタイルシートの仕様と、そのはるかに最近のCSS3リビジョンは、HTMLWebページを拡張およびフォーマットするために使用されるテクノロジです。 CSSは当初、Webページのプレゼンテーション層をより効率的な方法で処理するように設計されていました。 HTMLを使用したフォーマット。これは、現代のWebの複雑な構造を処理することを意図したものではありませんでした。 CSS2はCSS1の普遍的に採用されている拡張機能であるため、番号のないCSSという用語はCSS2が含まれていることを意味します。 CSS3仕様は2014年7月の時点でまだ開発中であるため、Web開発者は、機能のサポートがブラウザーによって異なることを考慮する必要があります。

CSS3はCSS2のアップデートであり、CSSのすべての機能との互換性を維持しています。CSS3はCSSコードを非推奨にしません。 CSS3コードは、Webページの見栄えを良くし、読み込みを高速化するとともに、ユーザーのブラウザーでページを作成するための開発時間を短縮するように設計されています。 CSS3を使用すると、Webデザインはページデザイン要素の画像ファイルへの依存度が低くなり、使用する画像が少なくなるため、ファイル転送要求とダウンロード時間が短縮されます。 CSS1は外観の書式設定に重点を置いていましたが、CSS2はテキストとオブジェクトの配置機能を追加しました。 IE 9以前のような古いバージョンのブラウザは、CSS3の追加機能を広くサポートしていないため、CSSフォールバックコードを維持するために追加の開発時間が必要になる場合があります。

CSS3以前は、Web開発者は、構造的な境界線や背景画像のグラデーションの角を丸くするなどの画像ファイルを設計する必要がありました。 CSS3には、数行のコードで追加できる同等の機能が含まれています。 CSSでは、Web開発者は境界線またはグラデーションをデザインし、それを画像サーバーにアップロードし、画像をページに配置し、CSSを使用して境界線を正しく配置する必要があります。 CSS3では、Web開発者は「.roundBorder {border-radius：10px;}」のようなコードで同様のことを実行できます。 背景のグラデーションはもう少し複雑で、ブラウザごとに異なるコードが必要です。 たとえば、ChromeとIEの白から黒へのグラデーションは、「。gradBG {background：liner-gradient（white、black）;}」のようなコードを使用します。

CSS3には、ページ要素の外観を改善するためにCSSにはない機能がいくつかあります。 CSS3を使用すると、Web開発者はテキストにテキストシャドウを追加して読みやすくしたり、視覚的なセンスを追加したりできます。また、長い単語内で改行を強制して、ワードラップを使用して列内に収めることができます。 CSS3以前は、Web開発者はJavaScriptやjQueryなどのスクリプト言語でアニメーションをコーディングする必要がありました。 CSS3は、デザインレイヤーにいくつかのアニメーション機能を追加します。 W3Cは、さまざまなアニメーション技法間の互換性の問題を解決するために、Webアニメーション標準に取り組んでいます。

CSS3には、新聞のように読むためにテキストセクションを複数の列に分割する機能が追加されています。 CSS2仕様では、標準ではテキストを自動的に分割する機能がないため、Web開発者は複数列のテキストセクションを作成するのに苦労しています。 特にレスポンシブデザインを特徴とするサイトでは、それに基づいてコンテンツを再配置およびサイズ変更する開発手法 デバイスの画面解像度を表示すると、モニターが大きい人は、 画面。