0

SASSで次のステートメントを実行しようとしています:

($value * $ratio) + "em";

私はそれを次のような結果にコンパイルしようとしています16emが、代わりに取得しています"16em"

強制関数 があるようcoerce(num_units, den_units)ですが、ドキュメントがわかりません。例が提供されていません。コンパイルしようとすると、関数が文字列として吐き出されます。

この関数を機能させる方法を誰か教えてもらえますか?

4

1 に答える 1

2

RubyにあるSASSソースコードのドキュメントへのリンクを提供しました。

関数はcoerce内部関数であり、実際にはメソッドとして数値に適用されることになっていますsome_number.coerce(...)。

この機能は SASS としては利用できません。

SASS で使用できる関数のリストについては、次のページを参照してください: http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html

ユニットを操作する既存の SASS 関数は存在しないため、独自に作成する必要があります。

@function strip-units($value)
  @if unitless($value)
    @return $value
  @else
    @return $value / ($value * 0 + 1)


@function add-unit($value, $new-unit)
  @return $value + 0#{$new-unit}


@function change-units($value, $new-unit)
  @return add-unit(strip-units($value), $new-unit)


$pxs-in-em: 16
@function pxtoem($px-value)
  @return change-units($px-value / $pxs-in-em, em)
@function emtopx($em-value)
  @return change-units($em-value * $pxs-in-em, px)




// Removing "px" from 1px
@warn "strip-units(1px)", strip-units(1px) // => 1

// Adding "px" to 1
@warn "add-unit(1, px)", add-unit(1, px) // => 1px

// Changing 1px to 1em
@warn "change-units(1px, em)", change-units(1px, em) // => 1em

// Converting 16px to 1em
@warn "pxtoem(16px)", pxtoem(16px) // => 1em

// Converting 1em to 16px
@warn "emtopx(1em)", emtopx(1em) // => 16px

デモ: http://sassbin.com/gist/5791446/

于 2013-06-16T08:56:52.083 に答える