전체 글100 SVG Ellipse * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Ellipse - 태그는 타원을 만들때 사용. 타원은 엄밀히 말하면 원에 가깝다. 둘의 다른점은 타원은 x, y 반지름이 다르다. 원은 x,y 반지름이 같다. 예제 1 Sorry, your browser does not support inline SVG. SVG 코드 코드 설명cx 요소와 cy 요소는 각각 타원의 x,y 좌표를 정의한다.rx 요소는 가로 반지름을 정의하고 ry 요소는 세로 반지름의 요소를 정의한다. 예제 2 Sorry, your browser does not support inline SVG. SVG 코드 예제 3 Sorry, your browser does n.. 2015. 6. 8. SVG Circle * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG Circle - 태그는 원을 만들때 사용한다 Sorry, your browser does not support inline SVG. SVG 코드 코드 설명cy , cy 요소는 원의 중심의 x , y 좌표를 정의한다. 만약 cx , cy 가 생략되었다면 원의 중심은 0,0으로 설정된다.r 요소는 원의 반지름을 정의한다. 출처 : W3SCHOOL.COM - SVG - Circlehttp://www.w3schools.com/svg/svg_circle.asp 2015. 6. 8. SVG rect * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. SVG 모양 SVG는 개발자들을 위해 미리 정의된 모양 요소들이 몇가지 있다.직사각형 원 타원 선 폴리라인 다각형 연결형 챕터를 따라오면 각 요소를 설명할 것이며, rect요소부터 시작하도록 한다. SVG 직사각형 - 예제1 요소는 직사각형과 직사각형 모양의 변화를 정의하는데 사용된다. Sorry, your browser does not support inline SVG. SVG 코드 코드 설명태그의 width 와 height 속성은 직사각형의 width,height 를 정의한다.style 속성은 직사각형의 CSS 값을 정의할 수 있다.CSS의 fill 속성은 직사각형내의 색상을 지정.. 2015. 6. 8. SVG in HTML * 본 글은 W3SCHOOL.COM 의 SVG 편을 해석 공부한 포스팅입니다.* 필자의 기준이 절대적인 진리는 아닙니다. HTML5 에서는 HTML 페이지 내에 SVG 요소들을 직접 삽입할 수 있습니다. HTML 페이지에 SVG를 직접적으로 끼워넣기.여기 간단한 SVG그래픽의 예가 있다. Sorry, your browser does not support inline SVG. HTML 코드 My first SVG SVG코드 설명 SVG 이미지는 태그와 함께 시작한다.SVG 태그 내의 width, height 속성은 SVG 이미지의 width,height 속성을 정의한다. 태그는 원을 그리는 태그다.cx, cy 속성은 원의 중심 좌표를 정의한다. 만약 cx,cy 속성이 정의 되어 있지 않다면 원의 중심은 (.. 2015. 6. 8. 이전 1 ··· 18 19 20 21 22 23 24 25 다음