svg 태그에 대해 알아보면서 추가적으로 , , 태그에 대해 알아보았다.요소는 그라데이션에 사용할 색상과 위치를 정의할 수 있다.offset : 그라데이션 스톱이 그라데이션 벡터를 따라 어디에 배치되는지를 정의stop-color : 그라데이션 스톱의 색상을 정의stop-opacity : ****그라데이션 스톱의 투명도를 정의  태그를 사용하면 다른 SVG 요소에 선형 그라데이션을 적용할 수 있다.x1 : 기준 축의 시작 점 x좌표y1 : 기준 축의 시작 점 y좌표x2 : 기준 축의 끝 점 x좌표y2 : 기준 축의 끝 점 y좌표gradientTransform (그라데이션 변환) : 그라데이션 좌표 시스템에 대한 추가적인 변환단위 : %See the Pen svg linearGradient by pmin..

svg로 작업을 하던 중 , 태그가 보여 알아보았다.나중에 참조할 그래픽 요소 같은 것들을 담아놓는 공간 요소 내에 선언된 그래픽은 SVG 뷰포트에 렌더링 되지 않는다. 화면에 렌더링 하려면 요소를 통해 참조를 해야 하며 사용 방법은 앞서 다운 요소와 동일하다. 내부에 선언된 그래픽 요소의 id 속성을 요소의 xlink:href 속성을 통해 참조하여 문서 전체에서 사용할 수 있다요소는 문서 전반에 걸쳐 요소를 재사용할 수 있다. x, y, width, height 속성을 사용해 설정이 가능하며, xlink:href 속성을 사용해 재사용할 요소를 호출(식별자 ID 참조) 할 수 있다. 요소를 재사용함으로써 제작 시간을 아낄 수 있고, 코드를 최소화할 수 있다. 기본 사용법See the Pen d..

SVG란?벡터 그래픽을 표현하기 위한  XML 마크업 언어이다. 픽셀 단위로 이미지를 구성하는 png, jpg와는 다르게 벡터 기반으로 이미지를 표현할 수 있다. 벡터 기반이다 보니 이미지를 축소하거나 확대해도 이미지가 깨지지 않고, 용량이 작기 때문에 웹상에서 주로 사용하는 이미지 형식이다.  W3C에서 개발했으며 CSS, DOM, SMIL과 호환된다. 태그란?웹상에서 벡터 이미지를 구현하기 위해 사용하는 마크업 태그이다. SVG 이미지를 구현하기 위해서는 태그로 시작하는데 width, height 속성을 사용하여 이미지의 가로와 세로 길이를 조절할 수 있다. HTML 상에 코드를 그대로 넣어줌으로 웹상에서 벡터 이미지를 구현할 수 있는데, 이 장점은 이미지를 따로 로드하지 않아도 된다는 것이다. 이미..