Wie kann ich mithilfe von CSS eine Fußzeile am unteren Rand des Browsers festhalten?

So fügen Sie mithilfe von CSS eine Fußzeile am unteren Rand des Browsers an

Wenn Sie vor der Herausforderung stehen, eine Fußzeile am unteren Rand des Browsers zu platzieren, ist dies ein häufiges Hindernis sein anhaltendes Erscheinen in der Mitte des Fensters. Um dieses Problem zu lösen, können Sie diese CSS-Stile verwenden:

• Bestimmen Sie die HTML-Struktur:

<code class="HTML"><form>
...
<div class="Main" />
<div id="Footer" />
</form></code>

• Definieren Sie das zugehörige CSS:

<code class="CSS">* {
    margin: 0;
}

html, body {
    height: 100%;
}

#Footer {
    background-color: #004669;
    font-family: Tahoma, Arial;
    font-size: 0.7em;
    color: White;
    position: absolute;
    width: 100%;
    bottom: 0px;
    height: 4em;
}

.Main {
    position: relative;
    min-height: 100%;
    height: auto !important;
    height: 100%;

    margin: 0 25% -4em 25%;

    font-family: Verdana, Arial, Tahoma, Times New Roman;
    font-size: 0.8em;
    word-spacing: 1px;
    line-height: 170%;
}</code>

Diese Stile geben die Position der Fußzeile als absolut und unten als 0 an, um sicherzustellen, dass sie am unteren Rand des Browsers befestigt bleibt.

Das obige ist der detaillierte Inhalt vonWie kann ich mithilfe von CSS eine Fußzeile am unteren Rand des Browsers festhalten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!