html+css

padding 과 margin

woooonikk 2022. 12. 9. 14:53

요소는 내용(content),패딩(padding),테두리(border)로 이루어져있당

 

padding과 margin은 시계방향으로 top right bottom left 속성을 가진당

ex) padding: 20px 50px 40px 5px;

요렇게 됨

두개만 쓰게 싶다면?

ex)padding: 25px(위아래) 50px(왼쪽 오른쪽);

이렇게된다

그리고 한개만 쓴다면

네방향이 모두 지정한 길이로 지정된다

 

padding 이란 안에서부터 커지는것 

margin 이란 간격이 띄워지는것!!

결과는

이렇게 된당

margin은 간격 띄우기!

간격이 요롷게 띄어진다

margin: 0 auto;

auto는 컴퓨터 보고 알아서 계산하라는 뜻이다 저렇게

margin 0(top,bottom) auto(left right);를 하게 되면 

컴퓨터가 알아서 계산해서 왼쪽 오른쪽에게 똑같이 나눠주게된다 따라서 가운데정렬 할때 유용함!!