>웹 프론트엔드 >CSS 튜토리얼 >LESS를 사용할 때 `calc()` 기능을 어떻게 보존할 수 있습니까?

LESS를 사용할 때 `calc()` 기능을 어떻게 보존할 수 있습니까?

DDD
DDD원래의
2024-12-07 19:23:16143검색

How Can I Preserve `calc()` Functionality When Using LESS?

LESS에서 calc() 기능 유지

LESS 스타일시트에서 calc() 함수를 사용할 때 컴파일 문제가 발생하여 잘못된 결과가 출력됩니다. 이 문제를 해결하기 위해 개발자는 이스케이프된 값이라고도 하는 이스케이프된 문자열을 활용할 수 있습니다.

원래 calc() 함수를 유지하려면 아래에 설명된 대로 문자열 내에서 함수 앞에 물결표(~)를 추가하세요.

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

이렇게 하면 LESS가 calc()를 일반 문자열로 해석하여 컴파일 중에 수정되는 것을 방지할 수 있습니다.

시나리오에서 Less 수학을 이스케이프된 문자열과 결합해야 하는 경우 다음 구문을 사용하십시오.

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

이 코드는 다음과 같이 컴파일됩니다.

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

이스케이프된 문자열을 활용하여 개발자는 계산( ) 함수는 올바르게 해석되어 LESS에서 예상한 대로 출력됩니다.

위 내용은 LESS를 사용할 때 `calc()` 기능을 어떻게 보존할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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