ホームページ  >  記事  >  ウェブフロントエンド  >  css3、less、sassとは何ですか

css3、less、sassとは何ですか

青灯夜游
青灯夜游オリジナル
2022-03-17 18:08:261933ブラウズ

css3 は、HTML や XML などのファイル スタイルを表現するために使用されるコンピュータ言語である CSS テクノロジのアップグレード バージョンです。Less は、CSS 拡張機能および動的スタイル シート言語、および CSS プリプロセッサです。Sass は、CSS 前処理です。 Ruby で書かれた言語で、ファイル スタイルを明確かつ構造的に記述するために使用できます。

css3、less、sassとは何ですか

このチュートリアルの動作環境: Windows7 システム、CSS3&&Sass3.7.4 バージョン、Dell G3 コンピューター。

CSS3 とは何ですか?

CSS とは、Cascading Style Sheets の略で、HTML (Standard Generalized Markup Language) や XML (Standard Generalized Markup Language) のサブセットなどを表現するために使用されるアプリケーションです。スタイルのコンピュータ言語。

CSS は、Web ページ内の要素の位置のレイアウトをピクセルレベルで正確に制御でき、ほぼすべてのフォント サイズ スタイルをサポートし、Web ページのオブジェクトとモデル スタイルを編集する機能を備えています。

CSS3 は、CSS (Cascading Style Sheets) テクノロジーのアップグレード バージョンです。1999 年に策定されました。2001 年 5 月 23 日に、W3C は主にボックス モデル、リスト モジュール、ハイパーリンクを含む CSS3 の作業草案を完成させました。メソッド、言語モジュール、背景と枠線、テキスト効果、複数列レイアウト、その他のモジュール。

CSS の進化における大きな変化の 1 つは、CSS3 を一連のモジュールに分割するという W3C の決定です。ブラウザ ベンダーは CSS のペースで急速に革新するため、モジュール型アプローチを採用することで、CSS3 仕様の要素は異なる速度で前進できます。これは、ブラウザ ベンダーが異なると特定の機能のみをサポートするためです。ただし、ブラウザーごとにサポートされる機能が異なるため、クロスブラウザー開発も複雑になります。

CSS3 の原理は CSS と同じで、Web ページ内のスタイルシートのセレクターをカスタマイズし、Web ページ内でそのセレクターを大量に参照することです。

新機能

CSS3 には、角丸、グラフィック境界線、ブロック シャドウやテキスト シャドウなど、RGBA を使用した透明効果、グラデーションの実現など、多くの新機能があります。エフェクトでは、@Font-Face を使用して、カスタマイズされたフォント、複数の背景画像、テキストまたは画像の変形処理 (回転、拡大縮小、傾き、移動)、複数列レイアウト、メディア クエリなどを実現します。

少ないとは何ですか?

Less は、CSS 拡張機能および動的スタイル シート言語であり、クライアント側またはサーバー側で実行できる CSS プリプロセッサであり、Web ページの表面のスタイルのカスタマイズ、管理、再利用に役立ちます。

Less はオープンソース言語であり、ブラウザ間互換性もあります。

利点:

1. CSS プリプロセッサが少なくなります。コンパイル後、ブラウザに適したシンプルな CSS が生成されます。

2. ブラウザ間の互換性のサポートが少なくなります。

3. Less はネストを使用するため、コードはより短く、よりクリーンで、特定の方法で編成されます。

4. Less は変数を使用するため、メンテナンスをより迅速に行うことができます。

5. Less は、コーディングを高速化して時間を節約するための一連の演算子を提供します。

6. Less は、外部ファイルを簡単に処理できるように @mport ルールを提供します。注: スタイルシートを 1 つのファイルに入れるのではなく、複数のファイルに分割する人が多いため、インポートが必要です。

7. Less はマージ属性を提供します。 Less の最もエキサイティングな機能は、transform、transition、box-shadow などの複数の値を受け入れることです。

8. JavaScript で記述される部分が少なく、他の CSS プリプロセッサよりも高速にコンパイルできます。

欠点:

1. CSS の前処理に慣れていない場合は、Less の関連知識を学ぶのに時間を費やす必要があります。

2. Compass、Gravity、Susy などのフレームワークを含む SASS などの古いプリプロセッサと比較して、Less が提供するフレームワークの数は少なくなります。

3. Less では、モジュール間に密結合があるため、関連モジュールの再利用やテストにはより多くの労力が必要になります。

sass とは何ですか?

Sass は CSS の上位のメタ言語で、ファイルのスタイルを明確かつ構造的に記述することができ、通常の CSS よりも強力な機能を備えています。 Sass は、よりクリーンで洗練された構文を提供すると同時に、保守しやすく管理しやすいスタイルシートを作成するためのさまざまな機能を提供します。

Sass は Ruby 言語で書かれた CSS 前処理言語で、2007 年に誕生し、最大の成熟した CSS 前処理言語です。元々は HAML (インデント付き HTML プリコンパイラー) で動作するように設計されていたため、HTML と同じインデント スタイルを持ちます。 SASS は、ルールのネスト、変数、ミックスイン、セレクターの継承などを追加する CSS3 の拡張機能です。コマンド ライン ツールまたは WEB フレームワーク プラグインを使用して、標準の整形式の CSS コードに変換します。

(学習ビデオ共有: css ビデオ チュートリアル Web フロントエンド )

以上がcss3、less、sassとは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。