So legen Sie die feste Position von div in HTML fest

WBOY
Freigeben: 2021-11-25 11:41:54
Original
14684 Leute haben es durchsucht

In HTML können Sie dem div-Element den Stil „position:fixed;“ hinzufügen und ihn auf eine feste Positionierung festlegen, sodass die div-Position festgelegt werden kann. Die Syntax lautet „

" .

So legen Sie die feste Position von div in HTML fest

Die Betriebsumgebung dieses Tutorials: Windows 7-System, HTML5-Version, Dell G3-Computer.

So legen Sie die feste Position von div in HTML fest

In HTML können Sie die Position mithilfe des Style-Attributs festlegen, um den Positionierungstyp des Elements anzugeben. Sie müssen lediglich seinen Wert auf „Fixed“ festlegen. Dies bedeutet, dass ein absolut positioniertes Element relativ zum Browser generiert wird, um das Browserfenster zu positionieren. Das heißt, die feste Position bleibt unverändert.

Nehmen wir ein Beispiel, um zu sehen, wie man die Position eines Divs fixiert. Das Beispiel sieht wie folgt aus:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div style="width:100%; height:100px; background:red; position:fixed; bottom:0;">这是一个固定在底部的div</div>
</body>
</html>
Nach dem Login kopieren

Ausgabeergebnis:

So legen Sie die feste Position von div in HTML fest

Im obigen Beispiel ist das Div unten fixiert Es reicht aus, das style-Attribut zum div-Element position:fixed style hinzuzufügen.

Empfohlenes Tutorial: „HTML-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo legen Sie die feste Position von div in HTML fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage