Elementos de bloque y elementos de línea en HTML

HTML clasifica a todos los elementos en dos grandes grupos: elementos en línea (inline elements en inglés) y elementos de bloque (block elements en inglés).

Las diferencias:

BLOQUE: Los elementos de bloque siempre empiezan en una nueva línea y ocupan todo el espacio disponible hasta el final de la línea, aunque sus contenidos no lleguen hasta el final de la línea. Esta nueva línea contiene un espacio superior y otro inferior.

LÍNEA: Los elementos en línea sin embargo no empiezan en nueva línea y solo ocupan el espacio necesario para mostrar sus contenidos

————

BLOQUE: La mayoría de elementos de bloque pueden contener elementos en línea y otros elementos de bloque.

LÍNEA: Los elementos en línea solo pueden contener texto u otros elementos en línea

==> En otras palabras, un elemento de bloque no puede aparecer dentro de un elemento en línea. En cambio, un elemento en línea puede aparecer dentro de un elemento de bloque y dentro de otro elemento en línea.

Lista de elementos de bloque y de línea definidos por HTML:

Los elementos de bloque definidos por HTML son:
  • address
  • blockquote
  • center
  • dir
  • div
  • dl
  • fieldset
  • form
  • h1
  • h2
  • h3
  • h4
  • h5
  • h6
  • hr
  • isindex
  • menu
  • noframes
  • nos-cript
  • ol
  • p
  • pre
  • table
  • ul

Los elementos en línea definidos por HTML son:
  • a
  • abbr
  • acronym
  • b
  • basefont
  • bdo
  • big
  • br
  • cite
  • code
  • dfn
  • em
  • font
  • i
  • img
  • input
  • kbd
  • label
  • q
  • s
  • samp
  • select
  • small
  • span
  • strike
  • strong
  • sub
  • sup
  • textarea
  • tt
  • u
  • var.

Los siguientes elementos también se considera que son de bloque:
  • dd
  • dt
  • frame-set
  • li
  • tbody
  • td
  • tfoot
  • th
  • thead
  • tr

Los siguientes elementos pueden ser en línea y de bloque según las circunstancias:
  • button
  • del
  • iframe
  • ins
  • map
  • object
  • script

Referencias
Librosweb.es : Elementos en línea y elementos de bloque
Juque
Mozilla Developer Center: HTML:Elemento:Tipos de elementos

One Response to “Elementos de bloque y elementos de línea en HTML”

  1. 2012 Fashion ideas b…

    Events in the past may be roughly divided into those which probably never happened and those which do not matter….

Leave a Response

You must be logged in to post a comment.