목록padding (1)

Dr Ghost Dev

HTML, padding, border, margin

웹 페이지를 박스처럼 관리하는 방법을 알아보겠다. 태그를 사용하여 내용물을 작성을 하면 그 내용물을 기준으로 내용물을 content, 내용물을 둘러싸는 경계선(border)이 있고 경계선과 내용물 사이에 안쪽 여백을 padding 마지막으로 경계선 바깥쪽 여백을 margin이 존재하는 구조로 생각하면 된다. 구별하기 쉽게 border에 색깔을 넣어 2개의 박스 형태처럼 만들어 보았다. firstbox secondbox h1 { border: 5px solid blue; } margin, padding에 아무런 효과를 넣지 않았기 때문에 경계선에 붙어있는 모습이다. padding의 효과를 알아보기 위해 2개의 box에 50px만큼 효과를 넣어 보겠다. h1 { border: 5px solid blue; p..
Front-End/HTML,CSS 2023. 10. 19. 18:38
이전 Prev 1 Next 다음