728x90
반응형
svg 안에 <text>를 이용해 글자를 넣습니다.
x,y | 텍스트가 위치할 위치를 지정합니다. |
dx, dy | x,y를 기준으로 이동시키는 상대좌표를 지정합니다. |
rotate |
각 글자수 마다 회전 각도를 지정할수 있습니다. (갯수가 일치하지않으면 별도 설정값을 갖지못할 글자는 모두 마지막 설정을 갖게 됩니다 ) |
textLength |
텍스트 길이를 설정합니다. (이 길이 값에 따라 글자간의 간격이 조정됩니다.) |
letter-spacing |
글자 간격 조정 |
word-spacing |
단어 간격 조정 |
text-decoration |
글자 꾸밈 (overline / underline / line-through ..) |
<tspan>을 이용해 글자를 나눠서 각 글자마다 설정을 다르게 줄 수 있습니다.
dy | 각 tspan요소의 높이 지정 |
728x90
반응형
'CSS > SVG' 카테고리의 다른 글
[SVG] 체크박스에 SVG 로 애니메이션 효과 넣기 (3382) | 2019.05.30 |
---|---|
[SVG]텍스트 애니메이션 효과 관련 참고 사이트 (406) | 2019.05.27 |
[SVG]svg시작해보기 4 - path그리기 애니메이션 (415) | 2019.05.27 |
[SVG]svg 시작해보기2 - path 도형그리기 (0) | 2019.05.27 |
[SVG]svg 시작해보기1 - 기본도형 그리기 (1) | 2019.05.24 |
댓글