Introducción a XHTML (N°22)

Publicado el 02/nov/2010 por y guardado en la categoría: Internet, Programacion.

Otra de estas etiquetas bloque utilizadas para los párrafos es la denominada de texto pre formateado; <pre>, Porque puede ser que en ocasiones queramos manejar un formato de texto en el documento que se mantenga exactamente el mismo que ya esta presente en ese texto particular que queremos añadir dentro de un documento HTML.

ejemplo18 150x150 Introducción a XHTML (N°22)ejemplo19 150x150 Introducción a XHTML (N°22)

En general se va tratar de texto que vamos a introducir a un documento normalmente mediante sistema de copiar y pegar y lo que queremos es que se mantenga ese mismo formateado, Literalmente lo que logra es que no se utilice las características propias de HTML sino mantener las ya presentes en el propio archivo que pegamos como podemos apreciar en las imágenes del ejemplo.

Introducción a XHTML (N°21)

Publicado el 29/oct/2010 por y guardado en la categoría: Internet, Programacion.

Cuarto elemento que veremos para aplicar a bloques son las listas, En HTML se especifican 3 tipos diferentes de listas que son: Listas ordenadas (<ol>), Listas no ordenadas (ul) y a las listas con definición. Tanto la lista ordenada como la desordenada toman un elemento para los ítems para los elementos <li>, Mientras que la lista definida toma los ítems de <dt> y <dd>, Una para el ítem de la definición y otra para la propia definición  como podemos ver en el ejemplo de las imágenes.

ejemplo16 150x150 Introducción a XHTML (N°21)ejemplo17 150x150 Introducción a XHTML (N°21)

Debido a que existen una gran cantidad de personalizaciones para cada uno de estos tipos de listas podemos crear muchos sub estilos de cada uno de los tipos, por ejemplo podríamos hacer que una lista ordenada en vez de aparecer ordenada por números aparezca ordenada por letras entre otros.

En anteriores versiones de HTML se podía en la propia etiqueta de las listas especificar distintas opciones de este tipo, Pero en la actualidad el estricto HTML y XHTML obligan que las opciones de la lista deban estar todas contenidas dentro de estilos.

Introducción a XHTML (N°20)

Publicado el 29/oct/2010 por y guardado en la categoría: Internet, Programacion.

El segundo de los marcadores para párrafos que veremos serán las cabeceras que como podemos ver en la imagen en la última versión de HTML admite hasta 6 niveles que van marcados desde <h1> hasta <h6> y cada tipo tiene ya unos atributos especificados en cuanto al tamaño, usualmente utiliza letra negrita y una serie de características que diferencian unas cabeceras de otras, En la imagen podemos ver los distintos tipos de las cabeceras así como el texto plano que aparecen en los párrafos, se trata desde luego de los niveles predefinidos por tanto hay que tener en cuenta que podemos personalizar una cabecera con algún estilo previamente creado como atributos de centrado color entre otros.

ejemplo14 150x150 Introducción a XHTML (N°20)ejemplo15 150x150 Introducción a XHTML (N°20)

El tercero de los marcadores para párrafos que veremos será la etiqueta <blockquote> la cual es usada para delimitar que es usada para delimitar bloques de texto acotado, en otras palabras lo que hace la etiqueta es sangrar el párrafo para destacarlo u diferenciarlo respecto del resto del documento, En la imagen la primera frase que aparece corrida a la izquierda esta antes de utilizar la etiqueta y luego aparece el resto con sangrado a la derecha.

Introducción a XHTML (N°19)

Publicado el 29/oct/2010 por y guardado en la categoría: Internet, Programacion.

Sin embargo este tipo de formateado de párrafo con las etiquetas  adentro, Ha sido desaprobado a favor de especificar este formateo a través de hojas de estilo a partir de HTML 4.0, De tal manera que podremos lograr el mismo resultado visto en el ejemplo del articulo 18 especificando primeramente en el <head> del documento el estilo que queremos aplicar (en la etiqueta <style>), Precedido del atributo “type” y este a la vez precedido de la opción de tipo de estilo que en este caso es “text/css”, Cerramos etiqueta de estilo.

Luego  Indicamos  que será para los párrafos “p”, Precedido del atributo que será “center” para este caso, Precedido del estilo entre llaves que en este caso será: “{text-align:center}”, y por ultimo cerramos etiqueta: </style>. Ahora adentro del párrafo simplemente cambiamos en el párrafo en la etiqueta párrafo el “align” por “class” (ya que ahora paso a ser una clase), Y el atributo ahora se aplicara como podemos ver en las imágenes.

ejemplo12 150x150 Introducción a XHTML (N°19)ejemplo13 150x150 Introducción a XHTML (N°19)

De entrada podría parecer un lio comparado con la forma del ejemplo anterior pero hay muchas razones para pasarse a la utilización de estilos las cuales se van notando a medida que se profundiza en el trabajo con HTML y se debe recordar que es algo que se esta estandarizando y por lo tanto a lo que es mejor irse adaptando y las ventajas que pueden resultar son indiscutibles.

Introducción a XHTML (N°18)

Publicado el 28/oct/2010 por y guardado en la categoría: Internet, Programacion.

Como con la mayoría de las etiquetas,  con el uso de la etiqueta <p> también podemos definir distintos elementos de formateado y atributos como la fuente, el alineado, el espaciado y muchos más pero por el momento solo veremos un ejemplo para lograr que un párrafo nos aparezca centrado usando la propia etiqueta del párrafo.

ejemplo101 150x150 Introducción a XHTML (N°18)ejemplo111 150x150 Introducción a XHTML (N°18)

Tan sencillo como escribir dentro de la propia etiqueta el nombre de la propiedad que se desea utilizar en este caso usamos  la llamada “align” (alineado) y posteriormente especificar la característica de alineado que se desea, en este caso “center” (centrado), y ahora en consecuencia el párrafo contenido dentro de estas etiquetas de apertura y cierre aparecerá centrado  en el navegador, no siendo así para los demás que no tienen la característica de “align” como podemos ver en las imágenes.

Diseño web y programación: Bahia Studio

Badoo