Wie zentriere ich einen Iframe horizontal in HTML und CSS?

Einen Iframe horizontal zentrieren

Beachten Sie das folgende HTML und CSS:

<div>div</div>
<iframe></iframe>

div, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;
}

Das Ziel besteht darin, den Iframe horizontal wie das Div zu zentrieren.

Der Iframe bleibt jedoch linksbündig. Dies liegt daran, dass Iframes standardmäßig Inline-Elemente sind. Inline-Elemente berücksichtigen margin: 0 auto; horizontal.

Um den Iframe zu zentrieren, müssen Sie ihn zu einem Blockelement machen. Dies kann durch Hinzufügen von display: block; zum CSS des Iframes:

iframe {
    display: block;
    border-style:none;
}

Mit diesem Zusatz wird der Iframe zu einem Blockelement und reagiert auf margin: 0 auto;. Dadurch wird es wie das Div.

horizontal zentriert

Das obige ist der detaillierte Inhalt vonWie zentriere ich einen Iframe horizontal in HTML und CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!