본문 바로가기

Coding

[HTML, CSS] border, padding (feat.form)

border(테두리 선 만들기)와 padding(여백 주기)을 이용하여 아래의 수정 전/수정 후 form 으로 바꿔보려고 한다.

 

수정 전
수정 후

 

.form {
     border: 2px solid;

     // form이 지정 된 div에 2px 굵기의 테두리 선을 만들어준다.

 

     border-radius: 10px;

     // border 모서리 각을 둥글게 바꿔준다.

 

     width: 450px;
     margin: auto;
     padding: 20px;

     // 모든 방향으로 여백을 준다. 한 쪽 방향만 여백을 주고 싶으면 padding-top/left/right/bottom

     입력해주면 된다.

}