2013-08-16 2 views
0

HTML 요소를 SVG 객체로 변환해야합니다. 나는 거의 한 가지를 제외하고, 그것을했을 : 나는 SVG 개체에 대해이SVG 객체에서 여러 배경을 채우는 방법은 무엇입니까?

background-image: linear-gradient(hsla(177, 83%, 28%, 0.5),hsla(177, 83%, 28%, 0.6)), url(http://s23.postimg.org/5osuy1fpj/diagonal_noise.png); 

를 변환하는 방법을 모르기 때문에 내가 SVG에서 여러 배경을 정의 할 수 없습니다; 여기

codepen link

사람이 당신은 거의 두 배경 (이미지 + 그라데이션)

답변

0

와 SVG 개체를 채우기 위해 도와 줄 수있다. 을 <pattern><image> 직전에 추가하기 만하면됩니다. <rect>의 채우기도 정의해야 할 linearGradient으로 설정하십시오.

또한 이미지에 opacity="0.6"을 추가해야합니다.

0

표준 SVG 그래디언트 채우기 만 사용하십시오. 모든 SVG 렌더링 엔진은 올바르게 인식하고 렌더링해야합니다. 이미지 대체가 필요하지 않습니다.

관련 문제