Bolehkah dua div HTML5 diletakkan dalam satu baris?-Soal Jawab bahagian hadapan-php.cn

Bolehkah dua div HTML5 diletakkan dalam satu baris?

青灯夜游

Lepaskan： 2022-04-25 17:32:44

asal

3427 orang telah melayarinya

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>

Salin selepas log masuk

bahagian hadapan web Bolehkah 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!