Iframe을 Div 내에서 수평으로 가운데에 배치하는 방법
소개:
iframe을 가운데에 배치 div 내에서 수평으로 배치하는 것은 일반적인 CSS 레이아웃 문제일 수 있습니다. 이 기사에서는 문제를 살펴보고 이러한 정렬을 달성하기 위한 솔루션을 제공할 것입니다.
문제:
코드 예제에 설명된 것처럼 iframe은 정의된 너비와 "여백: 0 자동;"이 있음에도 불구하고 가로 중앙에 표시되지 않습니다. 이는 iframe이 본질적으로 인라인 요소이므로 div 컨테이너와 유사하게 동작하지 않기 때문입니다.
해결책:
iframe을 중앙에 배치하려면 표시 속성을 변경해야 합니다. "차단"합니다. 이렇게 하면 iframe이 블록 수준 요소처럼 동작하여 "margin: 0 auto;"를 허용합니다. 속성을 적용하고 여백을 균등하게 분배합니다.
코드 예:
아래 수정된 CSS 코드는 iframe을 가로로 중앙에 배치합니다.
<code class="css">div, iframe { width: 100px; height: 50px; margin: 0 auto; background-color: #777; } iframe { display: block; border-style: none; }</code>
"display: block;"을 추가하여 iframe CSS에 추가하면 이제 iframe이 상위 div 컨테이너 중앙에 가로로 정렬됩니다.
위 내용은 귀하의 기사에 적합한 몇 가지 질문 기반 제목은 다음과 같습니다. * 내 Iframe이 Div에서 수평으로 중앙에 배치되지 않는 이유는 무엇입니까? * Div 내에서 Iframe을 중앙에 배치하는 방법: 간단한 솔루션 * Iframe Hori 중심 맞추기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!