• sass

    関数を作る

    2013/01/17

    とにかく関数を作ってみたい!

    sass.png

     

    sassでは便利な関数が沢山用意されています。


    例えばこんなもの

    
    //小数点以下を切り上げる
    ceil()
    
    //値のデータ型を取得する
    type-of()
    
    //グレースケールに変換する
    grayscale()
    
    

    関数は自分で作ることができるらしく。
    だったら作りたーーーい!\(^o^)/

    特にほしい関数はないんですが、ただただ関数を作ってみたいのでやってみます\(^o^)/

     

    書き方

    
    @function 関数名($引数){
      @return 処理;
    }
    
    

    これでおっけ!



    本当に思い浮かばないので、すごく単純な関数を・・・。

     

    値を3で割り、小数点以下がある場合は切り上げを行う関数(関数名:kanapple)

    
    @function kanapple($value) {
      @return ceil($value / 3);
    }
    
    

    関数名kanapple(ふざけてますねすみません)を定義して引数には値を。
    切り上げ処理のceil()関数の中で、値を3で割ります。



    この関数を使う時はこんな感じで

    
    width: kanapple(10px);
    height: kanapple(15px);
    
    

    ↓コンパイル結果は

    
    width: 4px;
    height: 5px;
    
    

    よし!できたあああ!

    でもこれ使い道ないなー(・ัω・ั)

    便利な関数を早く作りたいー!!\(^o^)/

    タグ:Sass

この記事へのコメント

コメントを送る

  ※ メールは公開されません
Loading...
 画像の文字を入力してください

back