2014년 3월 23일 일요일

[CSS] css3의 새로운 기능 border-radius 속성

오늘은 css3에서 새롭게 추가된 기능중 하나인 border-radius 속성에 대해서 알아보도록 하겠습니다. border-radius 속성을 사용하게 되면 테두리가 둥근 사각형 또는 원을 만들수 있습니다. 그렇게 때문에 css에서 이미지를 불러와 사용할수 있던 부분이 이제는 border-radius 속성 만으로 표현이 가능해 진거죠

빠른 이해를 위해 아래의 예시를 먼저 보도록 하겠습니다

div 라는 박스 안에 border-radius속성을 30px 값을 주게 되면 아래와 같은 이미지가 나오게 될겁니다.


이처럼 border-radius 속성은 테두리가 둥근 사각형을 만들때 유용하게 사용할수 있는 속성입니다 또한 border-radius속성은 4개의 크기 단위를 각각입력할수 있는데요 아래의 이미지를 참고하시면 쉽게 이해하실수 있을겁니다.








댓글 없음:

댓글 쓰기