Elemento SPAN
span: elemento de línea
Hemos visto elementos como strong o em utilizados para marcar fuerza o enfatizado respectivamente. Existe un elemento genérico de agrupación en línea llamado span. Con él podemos agrupar un conjunto de palabras por algún criterio especial que se nos ocurra. Y luego podremos aplicar a todas ellas estilos mediante clases.
La idea es sencilla veamos un ejemplo:
En este sencillo y vegetal ejemplo, utilizamos span para agrupar frases según dos criterios semánticos humanos: tipos de frutas y ejemplos de frutas. A cada una de éstos elementos lo hacemos pertenecer a una clase, la cual nos facilitará la aplicación de estilos a todos los elementos que pertenezcan a esa clase.
Los agentes de usuario no suelen representar de manera diferente al texto en el renderizado de la etiqueta span.
Lo anterior renderizado por tu navegador se ve así:
Por esto uno se podría preguntar cual es su utilidad, más allá de su significación semántica. Aquí entra en juego la utilización de CSS para dotar de presentación nuestros contenidos.
Los estilos podemos definirlos en un archivo de texto plano independiente de nuestro documento XHTML o bien incluirlo en el mismo marcado con el elemento style dentro de la sección head.
...
<style type="text/css">.tipos_fruta { color:#FF0000; text-decoration:underline; } .ejemplo_fruta { color:blue; font-size:80%; }</style>
...
</head>Tu agente de usuario interpreta y renderiza de la siguiente manera los estilos anteriores:
Hemos logrado no sólo una agrupación semántica sino una presentación personalizada para todos los elementos agrupándolos por clases, y sin embargo hemos mantenido una separación entre el contenido y la presentación, que es uno de los objetivos fundamentales del XHTML.
1 aporte(s) de lectores:
excelente , esta muy entendible gracias por este tipo de ayudas
Publicar un comentario
ATENCIÓN: Por favor intenta aportar o preguntar sobre el tema que trata la página. Otro tipo de consultas o criticas puedes dejarlas en el libro de visitas. Los aportes y preguntas están moderados simplemente para evitar spam o comentarios fuera de lugar.