<ul>에서의 margin과 padding

김서현·2025년 1월 12일

frontend

목록 보기
12/34

HTML의 <ul>은 기본적으로 패딩과 마진이 포함되어 있어, 여백이 자동으로 생긴다.

이를 제거하지 않으면 <ul>이 상단이나 좌우에 불필요한 공간을 차지할 수 있어 디자인이 어긋남.

padding: 0;과 margin: 0;을 설정하면 이런 여백을 없애 깔끔한 디자인 가능.


그래서 홈페이지 과제1 만들 때 구조적 의미를 위해 nav 안 ul안 li를 썼다가 padding 0과 margin 0을 굳이 쓴 이유가
(div로 가로 나열로 처음에 썼다가 ul (세로가 기본값-> 내가 원하는 가로나열)로 수정함)

그게 없으면 오른쪽으로 치우쳐지고 뚱뚱했기 때문.



추가정보

  • ul: unordered list (정렬되지 않은 목록)
  • li: list item (목록 항목)

용어 설명

ul (unordered list)

"정렬되지 않은 목록"이라는 뜻으로, 순서가 중요하지 않은 항목들의 묶음을 나타냅니다.
예: 할 일 목록, 메뉴 항목 등.

li (list item)

"목록 항목"이라는 뜻으로, 리스트의 각각의 아이템(항목)을 나타냅니다.
예: "Graduation", "About", "Skills" 등이 각각 <li>로 표현됩니다.

profile
한양대 학생입니다. 서울캠입니다.

0개의 댓글