CSS 센터링 방법은 무엇입니까?

1.text-align:center;

위 방법을 사용하여 중앙에 배치하는 것은 상위 컨테이너의 인라인 요소 또는 display:inline의 텍스트를 수평으로 중앙에 배치하는 것입니다.

2.inline-height: (높이) 값

인라인 높이를 사용할 때는 내용을 세로로 가운데에 배치하기 위해 높이와 함께 사용하는 경우가 많습니다.

3.margin :auto;

　중앙에 여백을 사용하는 경우 일반적으로 요소가 정확한 너비 값을 제공하는 경우 margin:auto; 또는 margin: 0 auto를 설정하면 현재 요소가 가로로 중앙에 배치됩니다.

사용 여백을 사용하는 경우 margin-left와 margin-right의 값을 동일하게 설정할 수도 있으며 수평 센터링도 가능합니다.

4. 위치 위치 지정 및 센터링

　에 따라 설정; 위쪽과 왼쪽 또는 아래쪽과 오른쪽은 요소를 수평으로, 수직으로 중앙에 배치할 수 있지만 상위 요소는 높이를 설정해야 합니다.

　 Flex 컨테이너의 flex-align:center;

　　-items: center;

　　justify-cotent:center;

　항목 속성 align-self:center;

6. 음수 여백:

 1 .box { 2     width: 600px; 3     height: 400px; 4     position: relative; 5 } 
 6  7 .box1 { 8     width: 300px; 9     height: 200px;10     padding: 20px;11     position: absolute;12     top: 50%;13     left: 50%;14     margin-left: -170px;/*(width+padding)/2 */15     margin-top: -120px;/*(height+padding)/2 */16 }

　 위의 코드는 요소의 가로 및 세로 중앙 정렬을 구현할 수 있습니다.

위 내용은 CSS 센터링 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!