728x90
border-radius 속성은 모서리 반경에 값을 주어, 해당 요소의 모서리를 둥글게 표현하도록 합니다.
이 속성은 IE9 이상의 브라우저에서 지원됩니다.
모든 모서리에 10px로 동일한 값이 적용됩니다.
border-radius: 10px;
4개의 모서리에 각각의 값을 적용할 수 있습니다.
border-top-left-radius: 10px;
border-top-right-radius: 20px;
border-bottom-right-radius: 30px;
border-bottom-left-radius: 40px;
각각 다른 값을 한 줄에 작성할 수도 있습니다.
첫 번째 40px은 상단 왼쪽 모서리, 두 번째 30px은 상단 오른쪽 모서리, 세 번째 20px은 하단 오른쪽 모서리, 네 번째 10px은 하단 왼쪽 모서리로
상단 왼쪽부터 시계 방향으로 값이 적용됩니다.
border-radius: 40px 30px 20px 10px;
2개의 값을 작성할 경우에는
첫 번째 10px은 왼쪽 상단과 오른쪽 하단 모서리에 적용되고, 두 번째 20px은 오른쪽 상단과 왼쪽 하단 모서리에 적용됩니다.
border-radius : 10px 20px;
728x90
