svg 직사각형 <rect>

 

<rect>

직사각형을 만들기 위해서는 rect를 사용합니다.

 

<svg width="500" height="500">
  <rect width="100" height="80" style="fill:#adffd1;stroke-width:3;stroke:#00203f" />
</svg>

위에 예시를 찬찬히 살펴 보면

• width, height 속성 : 넓이와 높이 값 지정
• style 속성 : css 속성 정의
• fill속성 : 채우기 색상
• stroke-wiidth : 테두리 너비
• strock : 테두리 색상

 

 

출처 https://www.w3schools.com/graphics/svg_rect.asp