STYLE

Shared Between CSS and SVG

HTML 요소에 사용되는 일부 CSS 속성이 SVG 요소에게도 동일하게 사용이 가능하다.

  • Font

    • font

      폰트의 종류, 크기, 행간, 스타일, 굵기, 대소문자 처리를 한번에 설정하는 속기 속성이다.

    • font-family

      글꼴을 지정한다.

    • font-size

      글꼴의 크기를 설정한다.

    • font-size-adjust

      글꼴 대체가 발생할 때 텍스트의 가독성과 겉보기 크기를 유지하는 방법을 제공한다. 사용된 글꼴에 관계없이 지정된 매트릭이 동일하도록 사용된 글꼴 크기를 조정한다.

    • font-stretch

      텍스트를 넓히거나 좁힐 수 있다.

    • font-style

      글꼴의 모양을 설정한다.

    • font-variant

      font-variant 하위의 모든 속성(font-variant-*)을 속기로 설정할 수 있다.

    • font-weight

      폰트의 굵기를 설정한다.

  • Text

    • direction

      블록 레벨 요소 내에 텍스트의 (쓰기)방향을 지정한다.

    • letter-spacing

      문자 간격을 조정한다.

    • text-decoration

      텍스트의 장식을 설정하는 속기 속성이다.

    • unicode-bidi

      direction 속성과 함께 문서의 양방향 텍스트 처리 방법을 설정한다.

    • word-spacing

      문장내 공백이 존재하는 경우 공백을 늘리거나 줄인다.

  • Etc

    • cursor

      커서의 모양을 설정한다.

    • display

      요소의 화면 출력 방식을 설정한다.

    • overflow

      요소 내의 콘텐츠의 크기가 정해진 요소 영역을 벗어나는 경우에 가로, 세로 방향으로 벗어나는 콘텐츠를 속기 방식으로 설정한다.

    • visibility

      요소의 화면 표시 여부를 설정하며 hidden 설정시 원래 가지고 있던 요소의 영역은 그대로 유지된다.