Rumah > hujung hadapan web > html tutorial > Bagaimana untuk menetapkan kedudukan tetap div dalam HTML

Bagaimana untuk menetapkan kedudukan tetap div dalam HTML

WBOY
Lepaskan: 2021-11-25 11:41:54
asal
14710 orang telah melayarinya

Dalam HTML, anda boleh menambah gaya "position:fixed;" pada elemen div dan menetapkannya kepada kedudukan tetap, supaya kedudukan div boleh dibetulkan "

".

Bagaimana untuk menetapkan kedudukan tetap div dalam HTML

Persekitaran pengendalian tutorial ini: sistem Windows 7, versi HTML5, komputer Dell G3.

Cara untuk menetapkan kedudukan tetap div dalam HTML

Dalam html, anda boleh menggunakan atribut gaya untuk menetapkan kedudukan untuk menentukan jenis penentududukan elemen. Anda hanya perlu Nilainya ditetapkan kepada tetap, yang bermaksud elemen yang diposisikan secara mutlak dijana dan diposisikan berbanding tetingkap penyemak imbas. Iaitu, kedudukan tetap kekal tidak berubah.

Mari kita ambil contoh untuk melihat cara membetulkan kedudukan div Contohnya adalah seperti berikut:

<!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>
Salin selepas log masuk

Hasil keluaran:

Bagaimana untuk menetapkan kedudukan tetap div dalam HTML

Dalam contoh di atas, div ditetapkan di bahagian bawah, cuma tambahkan position:fixed style pada elemen div melalui atribut gaya.

Tutorial yang disyorkan: "tutorial video html"

Atas ialah kandungan terperinci Bagaimana untuk menetapkan kedudukan tetap div dalam HTML. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan