SVG 스트로크 등록
SVG 스트로크 등록
SVG는 스트로크 속성의 넓은 범위를 제공합니다. 이 장에서는 다음 볼 것이다 :
- 행정
- 스트로크 폭
- 스트로크 linecap
- 스트로크 dasharray
모든 스트로크 특성은 선, 텍스트 등으로 원형 윤곽 형상 요소의 모든 유형에 적용 할 수있다.
SVG 스트로크 속성
스트로크 속성은 선 또는 텍스트 요소의 윤곽선 색을 정의한다 :
다음은 SVG 코드는 다음과 같습니다
예
<SVG의의 xmlns = "http://www.w3.org/2000/svg"버전 = "1.1">
<G는 = "없음"을 기입하지 않습니다>
<경로 스트로크 = "빨간색"D = "M5 20 l215 0"/>
<경로 스트로크 = "파란색"D = "M5 40 l215 0"/>
<경로 스트로크 = "블랙"D = "M5 60 l215 0"/>
</ G>
</ SVG>
<G는 = "없음"을 기입하지 않습니다>
<경로 스트로크 = "빨간색"D = "M5 20 l215 0"/>
<경로 스트로크 = "파란색"D = "M5 40 l215 0"/>
<경로 스트로크 = "블랙"D = "M5 60 l215 0"/>
</ G>
</ SVG>
»시도
오페라 사용자 : 보기 SVG 파일 (미리보기 소스 SVG 그래픽을 마우스 오른쪽 버튼으로 클릭).
SVG 스트로크 폭 속성
Tstroke- 폭 속성은 선 또는 텍스트 요소 개요 두께를 정의합니다 :
다음은 SVG 코드는 다음과 같습니다
예
<SVG의의 xmlns = "http://www.w3.org/2000/svg"버전 = "1.1">
<G 채우기 = "없음"스트로크 = "블랙">
<경로 스트로크 너비 = "2"D = "M5 20 l215 0"/>
<경로 스트로크 너비 = "4"D = "M5 40 l215 0"/>
<경로 스트로크 너비 = "6"D = "M5 60 l215 0"/>
</ G>
</ SVG>
<G 채우기 = "없음"스트로크 = "블랙">
<경로 스트로크 너비 = "2"D = "M5 20 l215 0"/>
<경로 스트로크 너비 = "4"D = "M5 40 l215 0"/>
<경로 스트로크 너비 = "6"D = "M5 60 l215 0"/>
</ G>
</ SVG>
»시도
오페라 사용자 : 보기 SVG 파일 (미리보기 소스 SVG 그래픽을 마우스 오른쪽 버튼으로 클릭).
SVG 뇌졸중 linecap 속성
StrokeLineCap은 특성이 다른 종류의 열린 경로의 끝을 정의한다 :
다음은 SVG 코드는 다음과 같습니다
예
<SVG의의 xmlns = "http://www.w3.org/2000/svg"버전 = "1.1">
<G 채우기 = "없음"스트로크 = "블랙"스트로크 너비 = "6">
<경로 뇌졸중 linecap = "엉덩이"D = "M5 20 l215 0"/>
<경로 뇌졸중 linecap = "라운드"D = "M5 40 l215 0"/>
<경로 뇌졸중 linecap = "광장"D = "M5 60 l215 0"/>
</ G>
</ SVG>
<G 채우기 = "없음"스트로크 = "블랙"스트로크 너비 = "6">
<경로 뇌졸중 linecap = "엉덩이"D = "M5 20 l215 0"/>
<경로 뇌졸중 linecap = "라운드"D = "M5 40 l215 0"/>
<경로 뇌졸중 linecap = "광장"D = "M5 60 l215 0"/>
</ G>
</ SVG>
»시도
오페라 사용자 : 보기 SVG 파일 (미리보기 소스 SVG 그래픽을 마우스 오른쪽 버튼으로 클릭).
SVG 뇌졸중 dasharray 속성
점선을 만드는 데 사용되는 속성을 StrokeDashArray는 :
다음은 SVG 코드는 다음과 같습니다
예
<SVG의의 xmlns = "http://www.w3.org/2000/svg"버전 = "1.1">
<G 채우기 = "없음"스트로크 = "블랙"스트로크 너비 = "4">
<경로 뇌졸중 dasharray = "5,5"D = "M5 20 l215 0"/>
<경로 뇌졸중 dasharray = "10, 10"D = "M5 40 l215 0"/>
<경로 뇌졸중 dasharray = "20,10,5,5,5,10"D = "M5 60 l215 0"/>
</ G>
</ SVG>
<G 채우기 = "없음"스트로크 = "블랙"스트로크 너비 = "4">
<경로 뇌졸중 dasharray = "5,5"D = "M5 20 l215 0"/>
<경로 뇌졸중 dasharray = "10, 10"D = "M5 40 l215 0"/>
<경로 뇌졸중 dasharray = "20,10,5,5,5,10"D = "M5 60 l215 0"/>
</ G>
</ SVG>
»시도
오페라 사용자 : 보기 SVG 파일 (미리보기 소스 SVG 그래픽을 마우스 오른쪽 버튼으로 클릭).