Elemente de blocare și în linie

Să înțelegem elemente de bloc și linie folosind exemplele de mai jos:

Exemplu de cod cu ieșire:

Blocare ieșire

Element la nivel de bloc:

Un element la nivel de bloc ocupă întregul spațiu al părintelui (container), cum ar fi <div> și <p> în exemplu.

Rețineți că ambele <div> și <p> începeți de la o nouă linie de fiecare dată, formând un în formă de bloc structura. Elementele la nivel de bloc încep pe linii noi.

Uzual elemente la nivel de bloc sunteți <div>,<p>,<article>,<section>,<figure>,<footer> etc.

Element în linie:

Inline așa cum spune numele „inclus ca parte a textului principal și nu ca o secțiune separată”. Elementele în linie ocupă spațiul după cum este necesar în spațiul definit de elementul principal. Spre deosebire de elementele la nivel de bloc, ele nu încep pe linii noi.

Unele dintre elemente inline sunteți <a>,<span>,<img>,<code>,<cite>,<button>,<input> etc.

Exemplu de cod cu ieșire:

Ieșire în linie

Notă : Elementele la nivel de bloc pot conține alte elemente la nivel de bloc sau elemente în linie. Elemente inline nu poti conțin elemente la nivel de bloc.

Modificări în HTML5

Deși o înțelegere a elementelor bloc și inline este încă relevantă, ar trebui să știți că acești termeni au fost definiți în versiunile anterioare ale specificației HTML.

În HTML5, un set mai complex de „categorii de conținut” înlocuiește elementele la nivel de bloc și elementele în linie. Elementele la nivel de bloc sunt plasate în mare parte în categoria „conținut de flux” în HTML5, în timp ce elementele în linie corespund categoriei „conținut de expresie”.

Pentru mai multe informații despre noile categorii de conținut în HTML5, inclusiv conținutul de flux și conținutul de formulare, consultați Pagina de categorii de conținut din rețeaua de dezvoltatori Mozilla.

Citiți mai multe despre HTML aici.