【CSS】좌우 중앙 정렬(블록 요소, 인라인 요소, 인라인 블록 요소)

margin: 0 auto;

블록 요소를 좌우의 중앙 맞춤(만나카)으로 한다
항상 width 지정



이 빨간 블록 요소를 좀 더 표시하고 싶습니다.

예.html

<p>左右のまんなか</p>

예.css

p {
  background-color: red;
  color: white;
  width: 300px;
  margin: 0 auto;
}

CSS의 맨 아래에 margin: 0 auto; 를 코딩.

웹
↓


좌우의 여러가지에 표시되었습니다!
주의 사항으로서는 반드시 width 로 폭을 지정하지 않으면 안됩니다.

text-align: center

인라인 요소, 인라인 블록 요소를 좌우의 중앙 정렬(만나카)로 한다

자세한 내용은 【CSS】text-align 의 text-align: center;을 참조하십시오.

정리하면 ...


블록 요소
인라인 요소
인라인 블록 요소


margin: 0 auto;
text-align: center
text-align: center


됩니다