CSS만 사용하여 Div 요소를 화면 중앙에 배치하는 방법은 무엇입니까?-CSS 튜토리얼-php.cn

How to Center a Div Element on the Screen Using Only CSS?

CSS를 사용하여 화면의 요소

질문:

화면 크기에 관계없이 CSS만 사용하여 화면의 요소를 표시하시겠습니까?

해결책:

(또는 ) 요소를 화면 중앙에 배치하려면 다음 단계를 따르세요.

요소의 위치를 "절대"로 설정하세요.
상단과 왼쪽을 설정하세요 속성을 "50%"로 설정합니다.
음수 여백을 사용하여 요소의 위치를 오프셋하여 표시되도록 합니다. 중앙 정렬:
```
<br> 여백 상단: -{height_of_element}/2;<br> 여백 왼쪽: -{width_of_element}/2;<br>
```

고정 예시 크기:

#myDiv {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
  width: 100px;
  height: 100px;
}

로그인 후 복사

참고:

위 내용은 CSS만 사용하여 Div 요소를 화면 중앙에 배치하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천：php.cn

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

저자별 최신 기사

에서 2024-04-29 11:01:01

2039

에서 2024-04-23 00:22:19

2199

에서 2024-04-19 15:37:47

1853

에서 2024-04-18 23:52:34

1745

CSS 마인드맵 코스웨어는 어디에 있나요? 코스웨어

에서 2024-04-16 10:10:18

1765