Bagaimana Saya Boleh Menghalang CSS KURANG daripada Mengubah Ubah Ungkapan `calc()`?

Mengatasi LESS CSS Calc() Isu Penyusunan

Dalam percubaan untuk menggunakan calc() dalam kod LESS, pembangun mungkin menghadapi isu di mana pengkompil KURANG mengubah pengiraan, mengakibatkan output yang salah. Contohnya, kod berikut:

width: calc(100% - 200px);

dijadikan sebagai:

width: calc(-100%);

Untuk menyelesaikan masalah ini, seseorang boleh menggunakan rentetan yang terlepas dalam LESS. Pendekatan ini membenarkan ungkapan calc() dianggap sebagai rentetan, menghalang pengkompil daripada memanipulasinya.

width: ~"calc(100% - 200px)";

Ini memastikan bahawa output akhir kekal konsisten dengan kod asal. Selain itu, adalah mungkin untuk menggabungkan Less math dengan rentetan terlepas, seperti yang ditunjukkan di bawah:

width: calc(~"100% - 15rem +" (10px+5px) ~"+ 2em");

Ini akan dihimpun kepada:

width: calc(100% - 15rem + 15px + 2em);

Kurang menggabungkan nilai dengan ruang secara lalai, membolehkan penyepaduan lancar rentetan yang terlepas dan hasil pengiraan. Melaksanakan teknik ini dengan berkesan melumpuhkan tiruan LESS bagi ungkapan calc().

Atas ialah kandungan terperinci Bagaimana Saya Boleh Menghalang CSS KURANG daripada Mengubah Ubah Ungkapan `calc()`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!