पट्टी-इकाई कार्य - सीएसएस-ट्रिक्स

Anonim

सस में इकाइयों के काम करने के तरीके के बारे में बहुत भ्रम है। फिर भी, वे वास्तव में वैसा ही काम करते हैं जैसा वे वास्तविक जीवन में करते हैं। यदि आप मूल्य की इकाई को निकालना चाहते हैं, तो आपको इसे 1 इकाई से विभाजित करना होगा। उदाहरण के लिए, की cmइकाई को निकालने के लिए 42cm, आपको इसे विभाजित करना होगा 1cm। यह सैस में बिल्कुल वैसा ही काम करता है।

$length: 42px; $value: $length / 1px; // -> 42

लेकिन क्या होगा अगर आप इकाई को उपयोग में नहीं जानते हैं? मान लें कि यह कुछ भी हो सकता है, पिक्सेल से emया यहां तक ​​कि vwऔर ch। फिर हमें किसी फ़ंक्शन में तर्क को अमूर्त करने की आवश्यकता है:

/// Remove the unit of a length /// @param (Number) $number - Number to remove unit from /// @return (Number) - Unitless number @function strip-unit($number) ( @if type-of($number) == 'number' and not unitless($number) ( @return $number / ($number * 0 + 1); ) @return $number; )

गणना अजीब लग सकती है लेकिन यह वास्तव में समझ में आता है। के लिए आदेश में 1की इकाई का $number, हम गुणा कर सकते हैं $numberद्वारा 0और फिर जोड़ने 1

प्रयोग

$length: 42px; $value: strip-unit($length); // -> 42