cari

Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Bolehkah dua div HTML5 diletakkan dalam satu baris?

Bolehkah dua div HTML5 diletakkan dalam satu baris?

青灯夜游
青灯夜游asal
2022-04-25 17:32:443463semak imbas

Elemen div HTML5 tidak boleh diletakkan dua dalam satu baris secara lalai. div ialah elemen peringkat blok Satu elemen akan menduduki satu baris Dua div tidak boleh dipaparkan pada baris yang sama secara lalai, anda boleh menambah gaya "display: inline;" kepada elemen div elemen, supaya berbilang div boleh direalisasikan pada baris yang sama.

Bolehkah dua div HTML5 diletakkan dalam satu baris?

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

Elemen div HTML5 tidak boleh diletakkan dua dalam satu baris secara lalai.

div ialah elemen peringkat blok dan satu elemen akan menduduki satu baris oleh itu, dua div tidak boleh dipaparkan pada baris yang sama secara lalai.

Bolehkah dua div HTML5 diletakkan dalam satu baris?

Ciri utama elemen peringkat blok ialah mereka menduduki barisan mereka sendiri

Ciri utama elemen peringkat blok ialah seperti berikut:

  • Tidak kira sama ada teg pemisah baris digunakan
    , elemen peringkat blok sentiasa bermula pada baris baharu;

  • Lebar, tinggi dan tepi luar elemen aras blok Jarak dan pelapik boleh dikawal

  • Jika lebar elemen aras blok diabaikan, lebarnya lalai kepada lebar; daripada tetingkap penyemak imbas semasa;

  • Tetapi anda boleh menggunakan atribut paparan untuk menukar elemen peringkat blok kepada elemen sebaris, supaya berbilang div boleh dipaparkan pada baris yang sama.
Ciri-ciri utama elemen sebaris adalah seperti berikut:

Elemen sebaris dan elemen lain akan dipaparkan pada baris yang sama;

    Lebar, tinggi, jidar dan padding elemen sebaris tidak boleh diubah

    • Lebar elemen sebaris ialah lebar kandungan dan tidak boleh diubah

    • Hanya teks atau elemen sebaris lain boleh dimuatkan dalam elemen sebaris.

  • Tukar elemen peringkat blok kepada elemen sebaris

Tetapkan
dalam elemen peringkat blok untuk membuat elemen peringkat blok menjadi elemen sebaris.

Contoh:

display：inline;

(Mempelajari perkongsian video:

tutorial video css
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<style type="text/css">
div{
background-color: #FFC0CB;
margin: 10px;
}
.box {
display: inline;
}
</style>
</head>
<body>
<div>一个div元素，块级元素</div>
<div>一个div元素，块级元素</div>
<div>一个div元素，转为了行内元素</div>
<div>一个div元素，转为了行内元素</div>
</body>
</html>
,

bahagian hadapan webBolehkah dua div HTML5 diletakkan dalam satu baris?)

Atas ialah kandungan terperinci Bolehkah dua div HTML5 diletakkan dalam satu baris?. 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
Artikel sebelumnya：Apakah penggunaan import seperti dalam es6Artikel seterusnya：Apakah penggunaan import seperti dalam es6

Artikel berkaitan

Lihat lagi