Rumah  >  Artikel  >  hujung hadapan web  >  Apakah peranan atribut float dalam atribut css

Apakah peranan atribut float dalam atribut css

藏色散人
藏色散人asal
2023-01-31 10:43:124224semak imbas

Fungsi atribut apungan dalam CSS adalah untuk mengawal pergerakan elemen Walaupun elemen bergerak ke kiri atau kanan, unsur-unsur di sekelilingnya juga akan disusun semula arah mendatar unsur itu; yang bermaksud bahawa elemen itu hanya boleh bergerak ke kiri dan ke kanan Ia tidak boleh bergerak ke atas atau ke bawah; elemen terapung akan cuba bergerak ke kiri atau kanan sehingga tepi luarnya menyentuh kotak yang mengandungi atau sempadan kotak terapung yang lain.

Apakah peranan atribut float dalam atribut css

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3, komputer DELL G3

Apakah peranan atribut float dalam atribut css ?

float, atribut CSS, nilai atribut utama adalah: kiri (kiri terapung), tiada (tidak terapung), kanan (kanan terapung), warisi (warisi elemen induk terapung), kebanyakannya menggunakan reka letak halaman Web.

CSS Float akan menggerakkan elemen ke kiri atau kanan, dan elemen sekeliling juga akan disusun semula.

Float sering digunakan untuk imej, tetapi ia juga sangat berguna dalam reka letak.

Cara elemen terapung

Unsur terapung secara mendatar, yang bermaksud elemen itu hanya boleh bergerak ke kiri dan ke kanan tetapi tidak ke atas dan ke bawah.

Elemen terapung akan bergerak sejauh kiri atau kanan yang mungkin sehingga tepi luarnya menyentuh sempadan kotak yang mengandungi atau kotak terapung lain.

Elemen yang mengikuti elemen terapung akan mengelilinginya.

Elemen sebelum elemen terapung tidak akan terjejas.

Jika imej terapung ke kanan, aliran teks berikut akan membungkusnya ke kiri:

Instance

img
{
    float:right;
}

Unsur terapung bersebelahan antara satu sama lain

Jika anda meletakkan beberapa elemen terapung bersama, ia akan bersebelahan jika ada ruang.

Di sini kita menggunakan atribut float untuk galeri imej:

Instance

.thumbnail 
{
    float:left;
    width:110px;
    height:90px;
    margin:5px;
}

Kosongkan float - gunakan clear

Selepas elemen diapungkan, elemen sekeliling akan disusun semula Untuk mengelakkan ini, gunakan atribut yang jelas. Atribut

jelas menyatakan bahawa unsur terapung tidak boleh muncul pada kedua-dua belah elemen.

Gunakan atribut yang jelas untuk menambah galeri gambar pada teks:

Contoh

.text_line
{
    clear:both;
}

Pembelajaran yang disyorkan: "tutorial video css"

Atas ialah kandungan terperinci Apakah peranan atribut float dalam atribut css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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