Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menghalang LESS-CSS daripada Mengubah Suai Fungsi `calc()`?

Bagaimanakah Saya Boleh Menghalang LESS-CSS daripada Mengubah Suai Fungsi `calc()`?

DDD
Lepaskan: 2024-12-13 07:36:12
asal
604 orang telah melayarinya

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

Penyelesaian untuk LESS-CSS Overwriting calc()

LESS-CSS mempunyai kecenderungan untuk mengubah suai sintaks fungsi calc(), yang membawa kepada output yang tidak dijangka. Untuk menangani perkara ini, kaedah alternatif diperlukan untuk menghalang LESS daripada mengubah sintaks.

Penyelesaian: Escaped Strings

Satu penyelesaian yang berkesan ialah menggunakan escaped strings, juga dikenali sebagai nilai yang terlepas. Dengan menggunakan aksara tilde (~) sebelum tanda petikan, LESS mentafsir kandungan dalam sebagai rentetan literal, menghalangnya daripada melakukan pengiraan atau pengubahsuaian.

Sebagai contoh, jika anda ingin mengeluarkan calc(100% - 200px) tanpa perubahan, anda akan menggunakan yang berikut sintaks:

width: ~"calc(100% - 200px)";
Salin selepas log masuk

Escaped Strings with Less Math

Dalam kes di mana anda perlu menggabungkan Less math dengan escaped strings, seperti:

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

LESS akan menggabungkan nilai ini dengan ruang secara lalai, menghasilkan nilai yang diingini keluaran:

width: calc(100% - 15rem + 15px + 2em);
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghalang LESS-CSS daripada Mengubah Suai Fungsi `calc()`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan