본문 바로가기
my_lesson/_CSS3

CSS3 lesson - 둥근 모서리 만들기[border-radius]

by boolean 2013. 11. 24.
728x90

CSS3 lesson - 둥근 모서리 만들기[border-radius]

CSS3 에서는 border-radius 속성을 이용해서 쉽게 둥근 모서리 box를 구현 할 수 있읍니다

세가지 방법

  • <style = "border - radius:20px;">(모서리 네군데 한번에..)
  • <style = "border - radius:20px 40px" >(대각 모서리 두종류..)
  • <style = "border - radius:20px 10px 30px 40px;" >(모서리 네군데 모두 다르게...)
  • 1.<style = "border - radius:20px;">(모서리 네군데 한번에..)

    <body>
    <style = "border - radius:20px;">(모서리 네군데 한번에..)
    </body>

    2. <style = "border - radius:20px 40px" >(대각 모서리 두종류..)

    <body>
    <style = "border - radius:20px 40px" >(대각 모서리 두종류..)
    </body>

    3. <style = "border - radius:20px 10px 30px 40px;" >(모서리 네군데 모두 다르게...)

    < body>
    <style = "border - radius:20px 10px 30px 40px;" >(모서리 네군데 모두 다르게...)
    that's
    good
    i like it
    </body >




    한두페이지의 HTML 문서를 만들 때에는 Internal Style Sheet나 Inline Style Sheet 방식을 사용해도 별 불편이 없지만, 여러 페이지의 문서를 만들 때에는 Linking Style Sheet 방식을 사용하는 게 좋습니다.


    'my_lesson > _CSS3' 카테고리의 다른 글

    CSS font attribute  (0) 2015.03.22
    CSS border-radius 이해하기  (0) 2014.08.15
    CSS3 lesson - css와 html 연결하기  (0) 2013.07.28
    CSS3 lesson - css란?  (0) 2013.07.28
    외부 스타일시트(External Style Sheet) 사용법  (0) 2013.07.24

    댓글