본문 바로가기
프로그램/HTML_CSS

[CSS3] border-radius 를 이용해서 박스 모서리를 둥글게 만들자

by 로드러너 2014. 3. 24.
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

바탕색이 회색인 가로세로 400px 짜리 레이어를 만들고 4곳의 모서리를 둥글게 나타내는 소스이다. border-radius 의 값이 클수록 원형에 가까워 진다.



<style>

#box{

width:400px;

height:400px;

background:gray;

border-radius:10px;

}

</style>


<div id="box">

//박스를 구성하는 내용 표시

</div>



* 지원 브라우저

크롬6+, 파이어폭스4+, 사파리5+, IE9+, 오페라10.5+, 안드로이드2.1+, iOS 3.1+