首頁 > web前端 > css教學 > 如何防止 LESS-CSS 修改 `calc()` 函數?

如何防止 LESS-CSS 修改 `calc()` 函數?

DDD
發布: 2024-12-13 07:36:12
原創
638 人瀏覽過

How Can I Prevent LESS-CSS from Modifying `calc()` Functions?

LESS-CSS 覆蓋 calc() 的解決方法

LESS-CSS 傾向於修改 calc() 函數的語法,從而導致意外的輸出。為了解決這個問題,需要一種替代方法來防止 LESS 改變語法。

解:轉義字串

一個有效的解法是使用轉義字串,也稱為作為轉義值。透過在引號前使用波形符號 (~),LESS 將其中的內容解釋為文字字串,從而阻止其執行計算或修改。

例如,如果要輸出calc(100% - 200px),如果不進行任何更改,您將使用以下語法:

width: ~"calc(100% - 200px)";
登入後複製

轉義字串Math

如果您需要將Less math與轉義字串結合起來,例如:

width: calc(~"100% - 15rem +" (10px+5px) ~"+ 2em");
登入後複製

LESS 預設會用空格連接這些值,從而得到所需的結果輸出:

width: calc(100% - 15rem + 15px + 2em);
登入後複製

以上是如何防止 LESS-CSS 修改 `calc()` 函數?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板