>웹 프론트엔드 >CSS 튜토리얼 >LESS-CSS가 `calc()` 함수를 수정하는 것을 어떻게 방지할 수 있나요?

LESS-CSS가 `calc()` 함수를 수정하는 것을 어떻게 방지할 수 있나요?

DDD
DDD원래의
2024-12-13 07:36:12635검색

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)";

Less로 이스케이프된 문자열 수학

다음과 같이 Less 수학을 이스케이프된 문자열과 결합해야 하는 경우:

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

LESS는 기본적으로 이러한 값을 공백과 연결하여 원하는 결과를 얻습니다. 출력:

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

위 내용은 LESS-CSS가 `calc()` 함수를 수정하는 것을 어떻게 방지할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.