div 센터링을 위한 CSS 코드

HTML에서 div를 가로로 가운데 맞추려면 text-align: center를 사용하세요. 세로 가운데 맞춤 단계는 다음과 같습니다. div의 높이와 세로선의 높이를 설정합니다. margin: 0 자동을 사용하면 콘텐츠를 세로로 가운데에 배치할 수 있습니다. Flexbox 또는 그리드 레이아웃을 사용하여 센터링을 수행할 수도 있습니다.

중앙 div용 CSS 코드

중앙 div

HTML에서 div는 기본적으로 페이지 왼쪽에 수평으로 정렬되는 블록 수준 요소입니다. CSS 속성을 사용하여 가운데 정렬을 수행할 수 있습니다.

가로 중심 맞추기

text-align 속성을 ​​사용하여 div의 콘텐츠를 가로 중앙에 배치하세요. text-align属性可以水平居中div的内容。

<code class="css">div {
  text-align: center;
}</code>

垂直居中

垂直居中div的内容比较复杂，需要使用以下步骤：

1. 设置div的高度和一个垂直线。
2. 使用margin

   <code class="css">div {
     height: 200px;  /* 设置div的高度 */
     line-height: 200px;  /* 设置垂直线的高度 */
     margin: 0 auto;  /* 将内容垂直居中 */
   }</code>

세로 중심

세로 중심 div의 콘텐츠는 더 복잡하며 다음 단계가 필요합니다.

1. div 높이와 세로선을 설정합니다.

2. margin 속성을 ​​사용하여 콘텐츠를 수직으로 중앙에 배치하세요.

   <code class="css">div {
     display: flex;
     justify-content: center;
     align-items: center;
   }</code>

   Flexbox를 가운데로 사용
   Flexbox 레이아웃을 사용하여 div를 가운데로 맞출 수도 있습니다. 🎜

   <code class="css">div {
     display: grid;
     place-items: center;
   }</code>

   🎜🎜그리드 레이아웃을 중앙에 사용 🎜🎜🎜그리드 레이아웃은 div를 중앙에 배치하는 데에도 사용할 수 있습니다. 🎜아아아아

위 내용은 div 센터링을 위한 CSS 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!