大手企業のCSS導入

一部のプログラミング言語人気統計サイトでは、HTML と CSS がプログラミング言語として扱われることがありますが、さまざまなプログラミング言語の機能が大きく異なるため、ほとんどのプログラマーはそれらがプログラミング言語のカテゴリに属する​​とは考えていません。 、論理制御、ループ操作、関数などが著しく不足しているか、せいぜいマークアップ言語です。

しかし、近年、Web アプリケーションの普及に伴い、HTML5 や CSS3 が徐々に成熟し、CSS の使用量や使用方法がますます豊富になり、開発のスピードが速くなっていると多くのプログラマーが感じています。 CSS の改善は明らかに実際のニーズに追いついていないため、CSS に関しては、SCSS や LESS など、CSS を強化するためのさまざまなツールが開発されています。これらのツールは、CSS の管理を容易にするだけでなく、CSS に大幅な改善をもたらします。構文とセマンティクスの用語。

2014 年は、多くの有名企業がさまざまなメディアやチャネルを通じて CSS の使用方法を明らかにした興味深い年でした。これには、彼らが使用したツール、使用した方法、これらの方法についての考え、および関連する具体的なデータや数値が含まれます。最も典型的なものは、Github 上の Mark Otto による CSS ファイルの紹介です。この記事の目的は、みんなの参考と比較のためにそれらをまとめることです。

会社 プリプロセッサ プレフィックス #ソースコード #セレクター 補助ツール 説明

Github SCSS カスタム @mixins 100+ 7,000 SCSS-lint、スタイルガイド 2 の最終スタイルシート、IE セレクター制限のため

バッファーが少ない オートプレフィクサー 93 5328 が少ない lint 2 の最終スタイルシート

CodePen SCSS オートプレフィクサー 171 1186 .editorconfig アセット パイプライン

Ghost SCSS (libsass) 自動プレフィクサー 36 1609 一般ガイドライン オープンソース

Groupon Sass (構文不明瞭) SMACSS ツールストラップ?

Lonely Planet Sass Autoprefixer 150+ 1527 Rizzo、リンティングなし BEM / OOCSS、Normalize.css、SVG アイコン

中 LESS カスタム @mixins 50-100 ガイドライン ネストなし、名前付けのカスタム方法

Trello LESS カスタム @mixins 44 2,426 プリプロセッサ 1 最終スタイルシート、名前空間

付録:

SCSS

Sass は、CSS (Cascading Style Sheets) の構文を拡張したもので、2007 年に誕生しました。変数、定数、ネスト、ミックスイン、関数などの CSS 機能を使用できる、最も初期の CSS プリプロセッサ言語です。より効率的かつ柔軟に記述できるようになります。 Sass は最終的にブラウザが使用できるように合法的な CSS をコンパイルします。つまり、Sass 自体の構文は標準の CSS 形式ではなく、構文内で動的変数を使用できるため、ブラウザが認識するのは容易ではありません。非常に単純な動的言語のようなものです。

実際、Sass には現在 2 つの文法規則があり、1 つは依然としてコード ブロックを区別するための区切り文字としてインデントを使用しており、もう 1 つの規則セットは CSS と同様に中括弧 ({}) を区切り文字として使用しています。後者の文法規則は SCSS とも呼ばれ、Sass3 以降のバージョンでサポートされています。

少ない

2009 年のオープンソース プロジェクトであり、Sass の影響を大きく受けていましたが、CSS 構文も使用されていたため、ほとんどの開発者やデザイナーが簡単に始めることができました。 LESS は、記述されたコードを標準 CSS コードにスムーズに変換するためのさまざまな方法を提供します。LESS は、多くの一般的なフレームワークやツールでよく見られます (たとえば、Twitter の Bootstrap フレームワークは LESS を使用します)。

Wikipedia の紹介によると、LESS は実際には Sass の影響下で Alexis Sellier によって作成されたオープンソース プロジェクトです。当時、SASS はコード ブロックを区別するための区切り文字として、CSS で広く使用されている中括弧 ({}) の代わりにインデントを使用していました。 CSS の既存ユーザーにとってより便利にするために、Alexis は LESS を開発し、CSS のような記述機能を提供しました。

以上が大手企業のCSS導入の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。