Gambaran keseluruhan dan perbezaan antara elemen sebaris html dan elemen peringkat blok html_HTML/Xhtml_Pengeluaran halaman web

Ciri elemen (blok) peringkat blok :
•Sentiasa menduduki satu baris, yang bermaksud bermula pada baris baharu dan elemen seterusnya juga mesti dipaparkan pada baris lain; ) , ketinggian, padding dan margin semuanya boleh dikawal;


Sifat elemen sebaris (sebaris) : • dan elemen Sebaris bersebelahan berada pada baris yang sama; , ketinggian, atas/bawah padding (padding-top/padding-bottom) dan atas/bawah margin (margin-atas/margin -bottom) tidak boleh diubah, iaitu saiz teks atau gambar di dalam


Elemen peringkat blok utama ialah
:

Salin kodKod tersebut ialah seperti berikut:

alamat, petikan blok, tengah, dir, div, dl, set medan, borang, h1, h2, h3, h4, h5, h6, jam, isindex, menu, noframes, noscript, ol, p, pra, jadual, ul

Elemen sebaris utama ialah
:

Salin kod Kodnya adalah seperti berikut:

a , abbr , akronim , b , bdo , big , br , cite , code , dfn , em , font , i , img , input , kbd , label , q , s , samp , pilih , kecil , span , strike , strong , sub , sup ,

textarea , tt , u , var

Elemen boleh ubah (sama ada elemen itu blok atau elemen sebaris ditentukan berdasarkan konteks)
:

Salin KodKodnya adalah seperti berikut:

applet, butang, del, iframe, ins, peta, objek, skrip

Aplikasi CSS tahap blok sederhana , elemen sebaris
: Menggunakan CSS, kita boleh menyingkirkan sekatan klasifikasi teg HTML dalam jadual di atas dan menggunakan atribut yang kita perlukan pada teg/elemen yang berbeza secara bebas.

Gaya CSS utama yang digunakan ialah tiga berikut
: •paparan:blok - dipaparkan sebagai elemen peringkat blok •paparan:sebaris - dipaparkan sebagai elemen sebaris
•dipslay:inline-block -- Dipaparkan sebagai elemen blok inline, dipaparkan secara selari dan boleh mengubah suai sifat seperti lebar, ketinggian, jidar dalam dan luar
Kami sering menambah paparan:inline-block pada

Elemen Gaya, senarai asal menegak boleh dipaparkan secara mendatar.


Di luar topik
: Baru-baru ini saya telah mengumpulkan beberapa pengetahuan yang berkaitan tentang perbezaan antara elemen peringkat blok dan elemen sebaris, saya menemui banyak artikel berkaitan di Internet dan mendapati bahawa pemahaman semua orang salah. Saya sendiri Selepas mengujinya sendiri, Saya mendapati banyak masalah: 1 dikawal, supaya anda boleh melepasi 4 sifat ini mengawal lebar elemen sebaris. 2. Teg elemen peringkat blok juga boleh diletakkan di dalam elemen sebaris, dan teg elemen peringkat blok dalaman akan mengembangkan teg sebaris luaran, supaya anda boleh mengawal ketinggian elemen sebaris dengan meletakkan elemen blok (pengenalan dalam talian satu-satunya perkara ialah elemen sebaris hanya boleh menyimpan teks dan elemen sebaris lain)
Contohnya:




Salin kod Kod Seperti berikut:
Ujian