tecnologia

Páginas: 16 (3889 palabras) Publicado: 9 de diciembre de 2014
CAPÍTULO 5 POSICIONAMIENTO Y VISUALIZACIÓN
Cuando los navegadores descargan el contenido HTML y CSS de las páginas web, aplican un procesamiento muy complejo antes de mostrar las páginas en la pantalla del usuario.
Para cumplir con el modelo de cajas presentado en el capítulo anterior, los navegadores crean una caja para representar a cada elemento de la página HTML. Los factores que se tienenen cuenta para generar cada caja son:
• Las propiedades width y height de la caja (si están establecidas).
• El tipo de cada elemento HTML (elemento de bloque o elemento en línea).
• Posicionamiento de la caja (normal, relativo, absoluto, fijo o flotante).
• Las relaciones entre elementos (dónde se encuentra cada elemento, elementos descendientes, etc.)
• Otro tipo de información, como porejemplo el tamaño de las imágenes y el tamaño de la ventana del navegador.
En este capítulo se muestran los cinco tipos de posicionamientos definidos para las cajas y se presentan otras propiedades que afectan a la forma en la que se visualizan las cajas.
5.1 TIPOS DE ELEMENTOS
El estándar HTML clasifica a todos sus elementos en dos grandes grupos: elementos en línea y elementos de bloque.
Loselementos de bloque ("block elements" en inglés) siempre empiezan en una nueva línea y ocupan todo el espacio disponible hasta el final de la línea. Por su parte, los elementos en línea ("inline elements" en inglés) no empiezan necesariamente en nueva línea y sólo ocupan el espacio necesario para mostrar sus contenidos.
Debido a este comportamiento, el tipo de un elemento influye de forma decisivaen la caja que el navegador crea para mostrarlo. La siguiente imagen muestra las cajas que crea el navegador para representar los diferentes elementos que forman una página HTML:

Figura 5.1 Cajas creadas por los elementos de línea y los elementos de bloque
El primer elemento de la página anterior es un párrafo. Los párrafos son elementos de bloque y por ese motivo su caja empieza en unanueva línea y llega hasta el final de esa misma línea. Aunque los contenidos de texto del párrafo no son suficientes para ocupar toda la línea, el navegador reserva todo el espacio disponible en la primera línea.
El segundo elemento de la página es un enlace. Los enlaces son elementos en línea, por lo que su caja sólo ocupa el espacio necesario para mostrar sus contenidos. Si después de este elementose incluye otro elemento en línea (por ejemplo otro enlace o una imagen) el navegador mostraría los dos elementos en la misma línea, ya que existe espacio suficiente.
Por último, el tercer elemento de la página es un párrafo que se comporta de la misma forma que el primer párrafo. En su interior, se encuentra un enlace que también se comporta de la misma forma que el enlace anterior. Así, elsegundo párrafo ocupa toda una línea y el segundo enlace sólo ocupa el espacio necesario para mostrar sus contenidos.
Por sus características, los elementos de bloque no pueden insertarse dentro de elementos en línea y tan sólo pueden aparecer dentro de otros elementos de bloque. En cambio, un elemento en línea puede aparecer tanto dentro de un elemento de bloque como dentro de otro elemento enlínea.
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 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, noscript,ol, p, pre, table, ul.
Los siguientes elementos también se considera que son de bloque: dd, dt, frameset, 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.
5.2 POSICIONAMIENTO
Los navegadores crean y posicionan de forma automática todas las cajas que forman cada página HTML....
Leer documento completo

Regístrate para leer el documento completo.

Estos documentos también te pueden resultar útiles

  • Tecnologia
  • Tecnología
  • Tecnologia
  • Tecnologia
  • Tecnologia
  • Tecnologia
  • Tecnologia
  • Tecnologia

Conviértase en miembro formal de Buenas Tareas

INSCRÍBETE - ES GRATIS