SVG => 용도

매개 변수

매개 변수	세부
엑스	좌상 구석의 x 축 좌표
와이	좌상 구석의 y 축 좌표
폭	`<use>` 요소의 너비
신장	`<use>` 요소의 높이
xlink : href	자원 식별자 (다른 요소의 ID를 참조) SVG 2는이를 비난하고 간단한 href 속성으로 대체 할 것을 제안합니다

비고

자세한 내용은 SVG W3C 권장 사항 및 SVG2에 대한 새로운 후보 권장 사항에서 확인할 수 있습니다.

아이콘 사용하기

<use> 요소는 <symbol> 요소와 공동으로 재사용 가능한 아이콘으로 자주 사용됩니다. 다음과 같이 보입니다.

<svg>
    <symbol viewBox="0 0 16 16" id="icon-star">
        <path d="M16 6.216l-6.095-.02L7.98.38 6.095 6.196 0 6.215h.02l4.912 3.57-1.904 5.834h.02l4.972-3.59 4.932 3.59-1.904-5.815L16 6.215" />
    </symbol>
</svg>

그리고 <use> 요소 :

<svg>
    <use xlink:href="#icon-star"/>
</svg>

<use> 요소는 <symbol> 복사하여 표시합니다. 개별 <use> 요소에서 <symbol> 의 스타일을 재정의 할 수도 있습니다 (예 :

<style>
    .red {
        fill: red;
    }
</style>

<svg>
    <use class="red" xlink:href="#icon-star"/>
</svg>

Modified text is an extract of the original Stack Overflow Documentation

아래 라이선스 CC BY-SA 3.0

와 제휴하지 않음 Stack Overflow

SVG
용도

수색…

매개 변수

비고

아이콘 사용하기