Less.js: border-radius가 올바르게 구문 분석되지 않음

에 만든 2020년 02월 06일 · 3코멘트 · 출처: less/less.js

border-radius에 /가 있으면 분할이라고 생각하지 않는 것처럼 보입니다 ...

재생산:

.border-radius {
  border-radius: 34px 0 0 36px / 34px 0 0 36px;
  border-radius: 10px 100px / 120px;
}

생산:

.border-radius {
  border-radius: 34px 0 0 1.05882353px 0 0 36px;
  border-radius: 10px 0.83333333px;
}

... 잘못된 것입니다. 여기에서 이것이 유효한 구문임을 알 수 있습니다.
https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius

출처

heavyk

👍2

가장 유용한 댓글

이 문제는 내가 만든 이 테스트 케이스 에서 볼 수 있습니다. 컴파일된 CSS를 보고 LESS가 CSS를 어떻게 렌더링하는지 확인하세요.

@heavyk 및 이것에 걸려 넘어지는 다른 사람을 위해 구문 분석 문제를 해결하기 위한 편리한 도구인 LESS에서 문자를 이스케이프할 수 있습니다. 이것은 내 테스트 케이스 에도 표시됩니다.

글보다...
border-radius: 10px 100px / 120px;

쓰다
border-radius: 10px 100px ~"/" 120px;

LESS에서 올바르게 구문 분석하여 / 문자를 그대로 두고 분할이 발생함을 나타내는 문자로 해석하지 않아야 합니다.

kbav 에 2020년 02월 18일

👍2

이 문제는 내가 만든 이 테스트 케이스 에서 볼 수 있습니다. 컴파일된 CSS를 보고 LESS가 CSS를 어떻게 렌더링하는지 확인하세요.

글보다...
border-radius: 10px 100px / 120px;

쓰다
border-radius: 10px 100px ~"/" 120px;

LESS에서 올바르게 구문 분석하여 / 문자를 그대로 두고 분할이 발생함을 나타내는 문자로 해석하지 않아야 합니다.

kbav 에 2020년 02월 18일

👍2

아 멋져요, 탈출 방법을 아는 것이 도움이 됩니다. 감사합니다!

heavyk 에 2020년 02월 24일

닫으면 몇 가지 해결 방법이 있습니다. 다른 하나는 http://lesscss.org/usage/#less -options-math에서와 같이 수학 모드를 변경하는 것입니다.

matthew-dean 에 2020년 04월 30일

👍1

이 페이지가 도움이 되었나요?

0 / 5 - 0 등급