IE9에서 일부 SVG 이미지가 불균형적으로 확장되는 이유는 무엇입니까?

IE9에서 SVG 이미지의 크기 조정 문제 해결

너비가 없는 경우에도 특정 SVG 이미지가 img 요소 내에서 지정된 최대 높이에 비례하여 크기가 조정되지 않습니다. 이러한 불균형적인 확대는 경로를 사용하여 생성된 SVG가 아닌 다각형으로 구성된 SVG에 주로 영향을 미치는 것으로 관찰됩니다.

불일치 이해

불일치는 viewBox 속성을 처리할 때 표준화가 부족하기 때문에 발생합니다. viewBox는 SVG 콘텐츠의 좌표와 크기를 명시적으로 정의하므로 콘텐츠의 크기를 적절하게 조정할 수 있습니다. 그러나 브라우저는 viewBox를 다르게 해석합니다.

영향을 받은 예에서 SVG에는 viewBox 속성이 없습니다. 따라서 IE9는 크기 조정을 위해 SVG 요소(이미지 요소가 아님)의 너비 및 높이 속성을 해석하여 불균형적인 크기 조정을 초래합니다.

문제 해결

브라우저 전반에서 일관된 크기 조정을 보장하려면 , SVG 요소에서 너비 및 높이 속성을 생략하면서 SVG 이미지에 대한 viewBox를 지정해야 합니다. 이 접근 방식은 브라우저에 명시적인 지침을 제공하여 IE9에서 불균형적인 확장으로 이어지는 불확실성을 제거합니다.

위 내용은 IE9에서 일부 SVG 이미지가 불균형적으로 확장되는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!