2015
06
25

超方便的css運算式

關鍵字:css運算式、css3

網頁切版時,每個區塊幾乎都需要指定寬度,才能把版型乖乖的排排站,把物件排到想要的地方,但是每次算寬度是不是覺得超麻煩!有時後還不能整除真的覺得很頭痛,算了老半天還不小心算錯,真的很讓人抓狂。
尤其是在寫響應試網頁的時候,在每個裝置下必須有不同的排列,光是一個頁面最少就要三個尺寸的寫法!

不過css3出現了一個超棒的屬性,對我們這些數學不好的人來說完全是一大福祉!那就是calc屬性,加減乘除(+ - * / )完全都難不倒他,例如:calc(500px/3),就直接幫你把500px÷3等分,更美好的地方在於,他可以將單位混合著用!!例如:calc(100%/3 - 4px),就算是%、px混著用都不是問題,完全不用自己換算,直接幫你算好好囉!!!是不是超貼心的!

不過+和-的部分,在寫的時候,記得要在前後加上空白,不然就無法使用囉!
正確寫法:calc(100%/3 - 4px)
錯的寫法:calc(100%/3-4px)
÷跟*就沒有這個問題了,加不加空白都不會影響唷!
傑立資訊傑立資訊事業有限公司

電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:service@julyinfo.com | 臺北市大安區和平東路3段257號6樓map

© 2016 傑立資訊 All rights reserved.法律顧問:宇恒法律事務所