CSS Shapes

CSS Shapes는 CSS에서 사용하기 위한 기하학적 도형을 설명한다. 레벌1 명세에 의하면 떠있는 요소에 CSS Shapes를 적용할 수 있다. 명세의 정의에 의하면 떠있는 요소의 모양을 정의 하거나 요소 상자의 사각형을 따르는 대신 테두리 선을 따라 감싸지도록 하는 방법 등 다양한 방법을 정의하고 있다.

기본 예제

아래 예제는 왼쪽에 떠있는 이미지에 shape-outside속성에 circle(50%) 값이 적용된 모습을 볼수 있다. 이런식으로 원모양을 만들면 도옇의 둘래를 따라 주변 텍스트가 흘러내리는것을 볼수 있다. 둘러싼 텍스트가 도형의 모양을 따라 길이가 변하게 되었다.

참고서

속성

자료형

안내서

외부 자료

명세

Specification
CSS Shapes Module Level 1