ホームページ > 記事 > ウェブフロントエンド > CleverCSSとは何ですか?
CleverCSS は、Python からインスピレーションを得た CSS 用の小さなマークアップ言語で、シンプルでクリーンな構造を使用しています。これを使用すると、スタイル シートをきちんと構造化された方法で作成できます。CleverCSS は CSS に最も似ています。明らかな違いは構文です。この構文はインデントに基づいており、単調ではありません。
CleverCSS は、Python からインスピレーションを得た CSS 用の小さなマークアップ言語で、すっきりとした構造化された方法でスタイルシートを作成するために使用できます。多くの点で、CSS2 よりもクリーンで強力です。
CleverCSS と CSS の最も明らかな違いは構文です。構文はインデントに基づいており、単調ではありません。これは明らかに Python のルールに違反しますが、スタイルを整理するためには良いアイデアです。
小さな例:
ul#comments, ol#comments: margin: 0 padding: 0 li: padding: 0.4em margin: 0.8em 0 0.8em h3: font-size: 1.2em p: padding: 0.3em p.meta: text-align: right color: #ddd
ただし、属性も使用できます:
#main p: font-> family: Verdana, sans-serif size: 1.1em style: italic
定数の定義:
background_color = #ccc #main: background-color: $background_color
暗黙的な連結:
padding: $foo + 2 + 3 $foo - 2 // returns: padding: 15 8; if $foo is 10
計算:
// calculations with numbers / values 42px + 2 -> 44px 10px * 2 -> 20px 1cm + 1mm -> 11mm (1 + 2) * 3 -> 9 // string concatenation foo + bar -> foobar "blub blah" + "baz" -> 'blub blahbaz' // You can also calculate with numbers: #fff - #ccc -> #333333 cornflowerblue - coral -> #00169d // You can also add or subtract a number from it and it will do so for all three channels (red, green, blue): crimson - 20 -> #c80028
プログラミング関連の知識については、プログラミング教育をご覧ください。 !
以上がCleverCSSとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。