CSS를 사용하여 SVG 경로의 채우기 색상을 변경할 수 있습니까?

CSS를 사용하여 SVG 경로를 동적으로 색상 지정

CSS를 사용하여 svg 경로의 채우기 색상을 변경할 수 있습니까?

고려하세요. 다음 SVG 코드:

<svg height="32" version="1.1" width="32" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.0166626px; top: -0.983337px;">
  <desc></desc>
  <defs></defs>
  <path style="" fill="#333333" stroke="none" d="M15.985,5.972C8.422,5.972,2.289999999999999,10.049,2.289999999999999,15.078C2.289999999999999,17.955,4.302999999999999...............1,27.68,22.274Z"/>
</svg>

내에서 명시적으로 변경하지 않고 CSS나 다른 방법을 사용하여 SVG 경로의 채우기 색상을 수정할 수 있습니까? 태그?

답변:

예, CSS를 사용하여 SVG 요소의 스타일을 지정할 수 있습니다. 그러나 HTML 스타일을 지정할 때와 마찬가지로 요소를 대상으로 지정해야 합니다. 예를 들어 모든 SVG 경로에 스타일을 적용하려면

path {
  fill: blue;
}

외부 CSS는 WebKit 및 Gecko와 같은 브라우저에서 경로의 채우기 속성을 재정의하는 경향이 있습니다. 그러나 태그(예: )를 사용하면 모든 외부 CSS 스타일이 재정의됩니다.

위 내용은 CSS를 사용하여 SVG 경로의 채우기 색상을 변경할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!