Bagaimana untuk memaparkan dua perenggan bersebelahan dalam css-tutorial css-php.cn

Bagaimana untuk memaparkan dua perenggan bersebelahan dalam css

WBOY

Lepaskan： 2021-12-03 09:26:56

asal

5431 orang telah melayarinya

Dalam CSS, anda boleh menggunakan atribut apungan untuk memaparkan dua elemen bersebelahan Atribut ini digunakan untuk menetapkan arah apungan elemen Apabila nilai atribut adalah "kiri", elemen terapung ke kiri, supaya unsur dipaparkan bersebelahan , sintaksnya ialah "elemen {float:left;}".

Bagaimana untuk memaparkan dua perenggan bersebelahan dalam css

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

Cara memaparkan dua perenggan bersebelahan dalam css

Anda boleh menggunakan atribut apungan untuk menetapkan apungan secara seragam ke kiri untuk dipaparkan dua perenggan unsur bersebelahan. Apabila nilai atribut ditinggalkan, elemen terapung ke kiri.

Atribut apungan mentakrifkan ke arah mana elemen terapung. Dari segi sejarah, sifat ini sentiasa digunakan pada imej, menyebabkan teks membungkus imej, tetapi dalam CSS, sebarang elemen boleh diapungkan. Elemen terapung mencipta kotak peringkat blok, tanpa mengira jenis elemen itu.

Jika unsur terapung tidak diganti, nyatakan lebar yang jelas jika tidak, ia dibuat sekecil mungkin.

Nota: Jika terdapat sangat sedikit ruang untuk elemen terapung pada satu baris, elemen akan melompat ke baris seterusnya Proses ini akan diteruskan sehingga baris tertentu mempunyai ruang yang mencukupi.

Contoh adalah seperti berikut:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            p{
                width:200px;
                height:100px;
                float:left;
            }
        </style>
    </head>
    <body>
        <p>这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本这是一段文本</p>
        <p>这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段这是另一段</p>
    </body>
</html>

Salin selepas log masuk

Hasil keluaran:

Bagaimana untuk memaparkan dua perenggan bersebelahan dalam css

(Belajar perkongsian video: tutorial video css )

Atas ialah kandungan terperinci Bagaimana untuk memaparkan dua perenggan bersebelahan dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!