SVG를 사용하는 방법은 다음과 같습니다.
resource.svg입니다:
이제 svg의 색상을 동적으로 변경해야 합니다. 이를 위해 SVG를 링크가 아닌 전체(인라인?) 로드한 다음 채우기 및 획의 값을 바꿀 수 있는지(문자열 대체 사용) 고려했습니다. 인라인으로 사용하면 CSS에서도 가능합니까?
이것이 가능하다면 누군가 나를 도와줄 수 있나요? 그렇다면 어떤 방향으로 더 연구해야 할까요?
svg 코드에서 채우기 속성을 제거합니다. 이로 인해 지금처럼 항상 흰색이 됩니다. 또는 프레임워크에서 작업하는 경우 채우기 속성을 동적으로 만들 수 있습니다(예: fill={{myProp}}).
fill={{myProp}}
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
svg 코드에서 채우기 속성을 제거합니다. 이로 인해 지금처럼 항상 흰색이 됩니다. 또는 프레임워크에서 작업하는 경우 채우기 속성을 동적으로 만들 수 있습니다(예:
fill={{myProp}}).