Sassの演算における単位について

Question

現在Sassの勉強をしている者です。

Sassの四則演算の箇所で１つ疑問に感じたところがあったため質問させていただきたく投稿させてもらいました。

例えば

box{
width: 300px + 5cm;
}

は計算が出来るが、px + emなどは計算が出来ないとありました。
Sassを使う中で違う単位を計算することは多くはないかもしれないとは思うのですが、計算できない単位同士はどうやって覚えればよいかわかりません。

もしよろしければ教えていただきたいです。
よろしくおねがいいたします。

Answer 1

計算できない単位同士はどうやって覚えればよいかわかりません。

CSSで使われる長さの単位は、大きく分けて「相対的なもの」と「絶対的なもの」に分けられます（MDN）。

• 相対的なもの…文書の状況によって長さが変わるもの（em、ex、vw、vh、remなど）
• 絶対的なもの…メートルと換算できるような、どこに書いても同じ長さのもの（cm、in、pt、pxなど）

絶対的な長さ同士であれば計算した結果をコンパイル時に出せますが、相対的な長さが含まれる場合はそうもいかないので、calc( 2em + 10px )のようにcalcでCSS処理時に計算する指定を行う必要があります。

Comments

[mana_mana419]

丁寧に教えていただきありがとうございます！

絶対単位と相対単位の違いだったのですね！！

おかげさまでスッキリすることができました。ありがとうございます。