border-radius
border-radius■ 웹 문서에서 다른 요소와 구분, 또는 정렬 등의 이유로 테두리를 만들어서 사용하는데요. 물론, 이 테두리의 모양 및 색깔과 굵기 등을 지정해서 만들 수 있습니다. 얼마 전에 이와 과련된 글을 정리해 놓은 게 있는데, 참고하실 분들은 참고하시구요. http://godvow.tistory.com/111 ◀ css border 속성 ■ 이번 글에서는 이 테두리의 모서리를 둥글하게 설정하는 속성인 border-radius에 대해서 알아보도록 하겠습니다. 모서리가 직각이면 날카롭고 딱딱한 느낌을 줄 수 있기 때문에 둥글게 만들어 주면 좋은데요. 네 군대의 테두리를 똑같은 모양으로 만들 수도 있고, 각각 다르게 만들 수도 있습니다. ■ 예제를 만들어가면서 속성을 적용해볼게요. 단순하게 메..
CSS3 border-radius
CSS3 border-radius ■ HTML로 웹 문서를 만들 때 이미지나 텍스트 단락을 태그를 이용해서 테두리를 만들어주는데요. 이 테두리의 기본 속성은 사각형입니다. 하지만 CSS3에서는 border-radius 속성을 이용해서 모서리를 둥글게 만들 수 있습니다. 이번 글에서는 이 radius의 속성값들을 알아보겠습니다. 먼저 예제로 사용할 박스를 하나 만들게요.■ 간단하게 가로 세로 400픽셀의 파란색 배경과 빨간색 테두리의 박스를 만들어봤는데요. 이 박스를 이용해서 테두리를 둥글게 만들어보겠습니다. 위 예제의 소스는 다음과 같습니다. ■ 속성에서 border-radius 값을 넣어서 변화를 줄 텐데요. 이때 속성값으로 넣을 수 있는 것들은 크기값(px) 또는 백분율(%) 입니다. 값은 순서대로 ..