}CSSをプログラムちっくに扱えるところが良いですねー。なれるとコーディングスピードアップまちがいなしですね!LESSとSCSSを実際に比較されたサイトがありますのでコチラが参考になります。私はどちらも使えるようになったらいいんじゃないの?って思います。機能的にはSCSSが多いですがほとんどLESSとかぶっているところが多いですしね~。若干の違うところがあるぐらいでほぼ一緒です。SCSSのインストール/コンパイル方法SCSS導入にはRubyが必要です。それからほんの少しだけどコードを知って置かなければならないのです。調べたらすぐ出てくるのですが、一応覚書で残しておきます。css/style.scss:css/style.css–watchコマンドをつければ自動的にコンパイルされます。cssファイルが多い場合はフォルダ指定しておけば全てに適応されます。scss:cssとすればファイル名同じままcssに展開してくれます。オプションで展開が4種類出力できます。・nestedデフォルトの展開方法です。・expanded典型的なCSSの記述スタイルです。私はこれで出力しています。・compact各属性を1行で書くスタイルです。・compresse圧縮版です。すべての属性に改行がないスタイルです。scss/style.scss:css/style.cssSASSフレームワークとしてCompassというのがあります。SASSのmixinとしてひと通り用意されてるのでかなり楽に作業が行えます。因みにSCSSとSassは同じではありません。これも若干違いがあります。以下はリファレンスとして載せておきます。SCSSの関数や用例を載せてあります。$blue)・変換RGB(赤、緑、青)色を16進トリプレットに変換します。$alpha)・変換RGBA(赤、緑、青、アルファ)色に四つ組を。$alpha)・任意の色値にアルファレイヤーを追加します。0.2)red($color)・色の赤色成分を取得します。55green($color)・色の緑色成分を取得します。161blue($color)・色の青色成分を取得します。[$weight])一緒に2つの色をミックスします。$lightness)・変換HSL(色相、彩度、明度)の色に16進トリプレットに変換します。アルファ)色に四つ組を。hue($color)・色の色相の値を取得します。saturation($color)・色の彩度の値を取得します。lightness($color)・色の輝度の値を取得します。$degrees)・色の色相を変更します。輝度と彩度を維持しながら、色の色相を変更します。色と度数を(通常の間に-360degと360deg)をとり、その値で色相の回転で色を返します。$amount)・色を明るくすることができます。0%~100%の色と量を取り、その値に加算明度で色を返します。$amount)・色を暗くすることができます。0%~100%の色と量を取り、その値に減少明度で色を返します。$amount)・色の彩度を加算。$amount)・色の彩度を減算。0%~100%の色と量を取り、その値の減算彩度した色を返します。#726b6bgrayscale($color)・グレースケールに色を変換します。complement($color)・色の補数を返します。invert($color)・色の逆関数を返します。opacity($color)・色のアルファ成分(不透明度)を取得します。$alpha)・任意の色の値のアルファレイヤーを追加または変更します。$amount)・色がより不透明になります。$amount)・色をより透明になります。値は、0~255の間でなければなりません。0~100%の間でなければなりません。アルファ値は0~1の間である必要があります。すべてのプロパティーはオプションです。RGB(赤、緑、青)プロパティとHSL(色相、彩度、輝度)プロパティの同時変更はできません。[$alpha]・色のコンポーネント(RGB,HSL)のいずれかを増減する。色のプロパティを調整します。アルファ値を変更できます。色を加算したり、減算することができます。[$alpha]・流動的に色の1つ以上のコンポーネントを拡張する。パーセンテージ値による色の目盛り一つ以上特性。彼らがすでにどれくらい高いか低いかについて基づいて、スケールカラーは彼らをなめらかに変えます。スケールカラーですでに淡い色を明るくすることはあまり軽さを変えません、しかし、同一量によって暗色を明るくすることはより劇的にそれを変えます。$colorが何であるかに関係なく、類似した影響を持ってください。色の軽さは、どこにでも0~100の間にあることができます。40%)、呼ばれます(軽さがその最初の軽さと100の間で方法の40%ある結果として生じる色のもの)。-40%)その代わりに呼びます、軽さはオリジナルと0の間の方法の40%です。[$alpha]・色の値を変更します。アルファ値を変更できます。値の色と現在の値が置き換えられます。0.8)文字列関数unquote($string)・文字列から引用符を削除します。文字列が引用されている場合は文字列から引用符を削除、またはそうでない場合は、同じ文字列を返します。hogequote($string)・文字列に引用符を追加します。$list-3)・単一のカンマ区切りリストのスペース区切りのリストに複数のリストを組み合わせます。結果として得られるリストの長さは最短のリストの長さです。blue数値関数percentage($value)・単位のない数字は、パーセンテージに変換されます。50%round($value)・最も近い整数に丸めます。11pxceil($value)・最も近い整数に丸めます。11pxfloor($value)・最も近い整数に丸める。10pxabs($value)・数値の絶対値を返します。10pxリスト関数length($list)・リストの長さを返します。$n)・リスト内の特定の項目を返します。[$separator])・ひとつにまとめ二つのリストを結合します。リストの末尾に追加しますが、リストが単一の場合、セパレーターはスペースで区切られます。value)・与えられたリスト内の指定された値の位置を返します。見つからない場合は、falseを返します。falseイントロスペクション関数type-of($value)・値の型を返します。引数の型を検査し、引用符のない文字列として型を返します。colorunit($number)・番号に関連付けられている単位を返します。数値の単位を検査し、引用符で囲まれた文字列として値を返します。複雑なユニットは、分子と分母のアルファベット順にソートされます。"em*px/cm*rem"unitless($number)・数値が単位を持っているかどうかを返します。false)で返します。$number-2)・2つの数字が追加または比較することができるかどうかを返します。2つの数字が、加算・減算、または比較する同じ単位の場合は、trueを返します。$if-false)・条件が真であるかどうかに応じて、二つの値のいずれかを返します。・指定回数繰り返して処理を行います。・リストがなくなるまで繰り返し処理を行います。・条件を満たす間、処理を繰り返す事が出来ます。}カスタム関数オリジナルで関数を作ることが可能です。コメントをキャンセルメールアドレスが公開されることはありません。作者:GretaThemesHOMEプロフィールPHP-Sample-Pageダウンロードお問い合わせ%d人のブロガーが「いいね」をつけました。