상자를 수평으로 중앙에 배치하는 CSS 코드

상자를 수평으로 중앙에 배치하려면 상위 컨테이너에 text-align: center 속성을 설정하면 됩니다. 1. 상자에 대한 display: inline-block 속성을 설정합니다. 2. 상자의 상위 컨테이너에 대한 text-align: center 속성을 설정합니다.

CSS를 사용하여 상자를 수평 중앙에 맞추는 방법

직답:

상자를 수평 중앙에 맞추려면 text-align: center 속성을 ​​설정할 수 있습니다. 상위 컨테이너에 . text-align: center 属性。

详细说明：

要让盒子水平居中，需要执行以下步骤：

1. 为盒子设置 display: inline-block; 属性。 这将使盒子成为块级元素，并允许对其进行水平设置。
2. 为盒子的父容器设置 text-align: center
세부정보:

상자를 수평 중앙에 맞추려면 다음 단계를 수행해야 합니다.

1. 상자의 display: inline-block; 속성을 ​​설정하세요. .

   이렇게 하면 상자가 블록 수준 요소가 되어 수평으로 설정할 수 있습니다.

2. 상자의 상위 컨테이너에 대한 text-align: center 속성을 ​​설정하세요.
   그러면 상자를 포함하여 상위 컨테이너의 모든 블록 수준 요소가 수평 중앙에 배치됩니다.

   샘플 코드:

   <code class="css">#parent {
     text-align: center;
   }
   
   #box {
     display: inline-block;
   }</code>

   애플리케이션 예:

   페이지에 다음 HTML 및 CSS 코드를 추가하세요.

   🎜🎜HTML: 🎜🎜

   <code class="html"><div id="parent">
     <div id="box">This box is centered horizontally.</div>
   </div></code>

   🎜🎜CSS: 레벨 상자 중앙에 "이 상자는 가로 중앙에 있습니다."라는 텍스트가 표시됩니다. 🎜

위 내용은 상자를 수평으로 중앙에 배치하는 CSS 코드의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!