Front-end/css

[css] margin:

sonzwon 2023. 9. 24. 12:40

margin은 요소 주변에 공간을 만드는데에 사용된다.(요소 테두리 밖으로 공간생김->padding과의 차이)

margin
margin-top
margin-right
margin-bottom
margin-left
auto 브라우저가 마진을 측정함
px, pt,cm ... px, pt, cm 등 구체적으로 지정
% 요소를 포함한 폭의 %를 구체적으로 지정
inherit 부모 요소로 부터 상속 받은 마진 
<shortand property>
(4)margin: top right bottom left
(3)margin: top side bottom
(2)margin: top/bottom side
(1)margin: all

margin collapse : 만약 h1태그에 margin-bottom: 50px, h2태그에 margin-top: 20px를 지정하면 총 70px의 마진이 생길꺼라 예상하겠지만, collapse가 생겨서 실제로는 50px의 마진이 생긴다.

margin 중앙정렬: { margin: auto; }