숫자 좌표 대신 백분율 (%)을 사용하는 것이 더 효율적이라는 것을 알았습니다. 그러나 경로 또는 다각형의 경우 점 좌표를 지원하지 않는 것 같습니다.
아래 코드와 같이 다각형의 점 '%'를 사용하여 사각형을 만듭니다.
<svg height="100" width="100">
<polygon points="'50%','10%' '10%','90%' '90%','80%'" style="fill:lime;stroke:purple;stroke-width:1" />
<rect width="90%" height="90%" x= "10%" style="fill:violet; stroke: red; fill-opacity: 0.5"/>
</svg>
이럴거야
<svg height="100" width="100">
<polygon points="50,10 10,90 90,80" style="fill:lime;stroke:purple;stroke-width:1" />
<rect width="90%" height="90%" x= "10%" style="fill:violet; stroke: red; fill-opacity: 0.5"/>
</svg>
정상적으로 작동합니다. 이에 대한 해결책이 있습니까?
viewBox를 사용하면 원시 숫자가 백분율처럼 동작하기 때문에 백분율이 필요하지 않습니다. 즉, viewBox = "0 0 100 100"을 설정하면 50은 50 %를 의미합니다.
이렇게 ...
<svg height="100" width="100" viewBox="0 0 100 100" preserveAspectRatio="none">
<polygon points="50,10 10,90 90,80" style="fill:lime;stroke:purple;stroke-width:1" />
<rect width="90" height="90" x="10" style="fill:violet; stroke: red; fill-opacity: 0.5"/>
</svg>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다