Las listas representan uno de los instrumentos ms difundidos para organizar la informacin dentro de los sitios web.

Una de sus caractersticas principales es la de proporcionar un cuadro claro y sinttico del tema tratado. HTML pone a disposicin distintos tipos de listas. A continuacin, analizaremos cada uno de ellos.

Listas ordenadas
Las listas ordenadas constan de una sola marca de apertura y cierre <OL></OL> y tantas marcas de lista como voces hay en el men <LI>. La sintaxis correcta para elaborar listas ordenadas es: <OL> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </OL> Para un ejemplo prctico, haz clic aqu En el ejemplo notamos cmo es posible omitir la marca <BR> para el salto de lnea, dado que est automticamente incluido en <LI>. Si no se establece diversamente (como veremos a continuacin), el tipo de lista ordenada que el navegador visualiza est numerada (es decir, la lista consta de una serie de nmeros que parte del 1 y va aumentando progresivamente). Las ltimas versiones de HTML prevn la posibilidad de listas ordenadas que contengan un sistema de ordenacin diverso del numrico antes citado: Ordenacin con letras maysculas: <OL TYPE=A> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </OL> Ordenacin con letras minsculas: <OL TYPE=a> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </OL> Ordenacin con nmeros romanos en mayscula: <OL TYPE=I> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </OL> Ordenacin con nmeros romanos en minscula (romanitos): <OL TYPE=i> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men

</OL> Para un ejemplo prctico, haz clic aqu

Listas desordenadas
Las listas desordenadas funcionan de manera similar a las ordenadas. La diferencia bsica es que en el caso de las listas desordenadas no existen relaciones jerrquicas entre los elementos del elenco, por lo cual no se prevn ordenaciones progresivas como las obtenidas mediante nmeros o letras. Las listas desordenadas constan de una sola marca de apertura y cierre <UL></UL> y tantas marcas de lista como voces hay que ordenar <LI>. La sintaxis correcta para definir una lista desordenada es: <UL> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </UL> Para un ejemplo prctico, haz clic aqu Si no se especifica diversamente, cada voz del elenco va precedida de un smbolo geomtrico. Al igual que para las listas ordenadas, tambin en este caso podemos indicar diversos tipos de smbolos: Los crculos slidos de la lista anterior se obtienen con disc: <UL TYPE=disc> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </UL> El atributo circle imposta circunferencias: <UL TYPE=circle> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </UL> El atributo square imposta listas definidas por cuadrados slidos: <UL TYPE=square> <LI> Primera voz del men <LI> Segunda voz del men <LI> Tercera voz del men </UL> Para un ejemplo prctico, haz clic aqu

gelfire.com Share: del.icio.us | digg | reddit | Twitter | facebook

HTML es el lenguaje para crear pginas web, es algo muy complicado, pero muy util
Para saber que es HTML primero necesitamos saber que es internet. La definicion de Internet es una red informtica, realmente se trata de un conjunto de ordenadores conectados entre s intercambindose informacin. El rpido y ascendente crecimiento de Internet ha conseguido que esta red haya pasado a llamarse La Red o la red de redes, debido a la existencia de ordenadores conectados a la misma en todo el mundo. HTML es un lenguaje sencillo pensado para presentar informacin en la WWW. HTML (HyperText Markup Languaje), es un lenguaje de marcas para la creacin de hipertextos. Por hipertexto entenderemos texto con una presentacin agradable, con inclusin de elementos multimedia (grficos, video, audio) y con la presencia de hiperenlaces que permiten relacionar otras fuentes de

informacin en documentos hipertextos. Es el lenguaje utilizado para representar documentos en la WWW (World Wide Web). Sitio Web es un conjunto de archivos electrnicos y pginas web referentes a un tema en particular que incluye una pgina inicial de bienvenida llamada Home Page, con un nombre de domicilioy direccin de internet especficos. Un portal web hace referencia y alberga varios sitios Web. Este requiere de mayor esfuerzo para su desarrollo y para mantener actualizando su contenido y servicios. Un Portal requiere de un equipo de personas permanente. Las diferencias entre un portal y un sitio web son que el portal sirve como sitio principal para los que se conectan a internet. Estos se visitan como sitios ancla (buscadores). Los Sitios Web contienen informacin relevante. A continuacion se explicara el proceso para el uso de HTML Conceptos Basicos: Todos los comandos se ponen entre los signos < >, Cuando se escribe algo entre esos smbolos significa que deseas empezar un

Guia para HTML

comando. Cuando quieres finalizar el comando necesitas cerrar los smbolos. Para cerrarlos debes teclear < / commando >. O sea debes agregar / despues del primer <. < b > texto < / b > hace que "texto" se vea en negritas. Como cerraste el comando todo lo que este despues de la palabra "texto" no estara en negritas Hay algunos comandos que no se necesitan cerrar las cuales se explicaran mas adelante. Una vez que entiendas que todo comando debe estar entre < estos simbolos > sera mas facil que domines HTML. Texto :

La mayoria de las paginas web estan compuestas de texto. Para escribir algo en to pgina web simplemente debes escribirlo. Debes usar comandos solo si quieres que el texto haga algo especial. Unos de los comandos mas usados son:
esto deja un renglon en blanco < p > empieza un nuevo parrafo < i > hace tu letra cursiva < u > subraya el texto < br > como cuando presionas "enter" en el teclado

es muy util para separar el texto < / i > debes cerrar este comando < / u > debes cerrar este comando

Tamao del texto

Tambien puedes cambiar el tamao de tu fuente. En HTML hay tamaos desde 1 (muy pequeo) hasta 7 (muy grande). Para cambiar el tamao debes teclear: < font size = 1 >escribe aqui el texto < / font > Debes cerrar el comando o de lo contrario todo el texto que siga sera de ese tamao Estos son los diferentes tamaos de letra que puedes usar:

Size 1

Size 2

Size 3

Size 4

Size 5

Size 6

Size 7

Ya que sabes como cambiar el tamao del texto y agrerle diferentes efectos, has superado otro dificil paso para HTML. Mas texto : Ahora nos podemos mover a cosas que hacen el texto un poco mas interesante. En este paso aprenderas como crear listas ordenadas y vietas.

Vietas El crear vietas es un poco mas complicado. En HTML las vietas se llaman "unordered lists" o ul abreviado. Para empezar una vieta debes teclear < ul >. Quieres que cada vieta aparezca en una nueva linea tecleas < li > antes. Cuando acabes todas tus vietas teclea < / ul > El codigo se vera asi: < < < < < ul > li > vieta uno li > vieta dos li > vieta tres / ul >

La pagina se vera asi:

vieta uno vieta dos vieta tres

Lista Numerada: El hacer lista numerada usa los mismos pasos para crear vietas exepto que se usa lista ordenada < ol > en vez de < ul >. El codigo para una lista ordenada debera verse asi: < ol > < li > punto uno < li > punto dos

< li > punto tres < / ol > La pagina se vera asi 1.punto uno 2.punto dos 3.punto tres Colores Puedes cambiar el color de tu letra muy facilmente. Para los colores mas usados puedes usar su nombre en ingles, como rojored, blanco-white etc. Si quieres cambiar tu texto a rosa necesitas teclear: < font color = "pink" > Texto < / font > y se vera como Texto Para colores mas especificos necesitas usar lenguaje hexadecimal. Este es el codigo unico que se le da a cada tono de color. Todos los colores tienen una combinacion de 6 numeros y letras que representan el tono exacto. Algunos tonos son: Purpura Rosa claro Azul claro Para una lista completa de los codigos de colores haz clic aqui Para usar el codigo hexadecimal debes teclear: < font color = "FF66FF" > texto < / font > apareceria texto SI quieres hacer tu pagina mas interesante

podrias cambiar el color del fondo. Los colores son los mismos que en el texto.Para cambiar el color teclea esto hasta el principio de tu pagina < body bgcolor = "#FFFFFF" > or < body bgcolor = "white" > No necesitas cerrar este comando ya que involucra toda la pagina Imagenes :

Las imagenes pueden hacer que tu sitio web se vea mas interesante. Una vez que sepas donde esta ubicada la imagen podras escribir el codigo que esta hecho de 3 partes: 1.< img src = " (ordena que la computadora busque una imagen) 2.http://www.tyler-adam.com/Lg-H.jpg (le indica a la computadora donde encontrar la imagen) 3."> (cierra el comando) Cuando lo pones junto se vera asi: < img src = " http://www.tyler-adam.com/LgH.jpg " > , Y la imagen sera esta: Este comando no lo debes cerrar Imagenes de fondo Para poner una imagen en el fondo debes teclear:

< body background = " http://www.tyleradam.com/Lg-H.jpg " > Links Para crear un link primero debes tener una pagina para el destino, y en seguida te mostraremos las partes de un linK: 1.< a href = (Indica que quieres crear un link) 2."http://www.abcdefghijklmnopqrstuv.com" > (Indica el destino del link entre comillas, aqui cierras el primer comando) 3.Haz clic (Es el texto que desearias que fuera selleccionado para que siguiera el link, no necesitas abrir otro comando) 4.< / a > (cierra el link) Junto se vera asi: < a href = " http://www.abcdefghijklmnopqrstuv.com " > Haz Clic < / a > Y el link (es falso, no lo selecciones), se veria asi: Haz Clic Simplemente se ve el texto "Haz Clic" Tambien puedes agregar imagenes para que sean seleccionadas en lugar del texto. Para

hacer esto simplemente pon la direccion de la imagen en vez del texto "Haz clic" Tables Este es el ultimo paso para una pagina web basica de HTML ya casi lo logras!. Las tablas son una gran manera de organizar una pagina web. Para crear una tabla debes empezarla y terminarla. Para empezarla debes teclear < table > y para terminarla < / table > (es muy importante terminarla porque de lo contrario se desubicaria) Cada tabla tiene al menos una fila. La fila de la tabla es una tabla horizontal hecha por x numero de celdas. En ellas puedes poner lo que quieras, texto, imagenes, links, etc. Si quieres crear una tabla con dos columnas y una fila, escribe: < table > < tr > - iniciar fila de la tabla < td > - iniciar celda de la tabla escribe texto o aade una imagen aqui < / td > < td > - iniciar la segunda celda de datos de la tabla escribe tu texto o imagen aqu < / td > < / tr > < / table > La tabla tendr el siguiente aspecto:

escribe texto o aade una imagen aqu escribe tu texto o imagen aqu

Estos son algunos ejemplos de paginas que haras este ao Y con esto terminamos la gua para HTML, espero que hayas aprendido. Back Hecho por Paulina Laguardia Gasca, Colegio Vista Hermosa, ultima actulalizacin 21 de abril 2005
para la elaboracion de una vieta en html la sintaxies es: <ul> <li>vieta 1</li> <li>vieta 2</li> </ul> se pueden poner todas las vietas necesarias y para poner el color de vietas en la sintaxis es: por ejemplo.. <ul style="color:blue"> Al igual que en un procesador de textos u otros programas, el lenguaje HTML permite aplicar vietas, a excepcin de que se cuenta slo con tres tipos diferentes de vietas. Vietas Para aplicar vietas debe hacerse uso de la instruccin <UL>. Esta instruccin indica al explorador que lo que sigue a continuacin es una lista con vietas. Por cada smbolo utilizado debe usar la instruccin <LI>, la cual se corresponde con cada lnea de dato de la lista. Finalmente debe cerrar la lista de vietas con la instruccin </UL>. Las siguientes lneas de cdigo muestran la forma como debe introducirse cada expresin en la pgina Web para su correcta ejecucin.

<ul> <li>Vieta 1</li> <li>Vieta 2</li> <li>Vieta 3</li> <li>Vieta 4</li> </ul> Si copia estas lneas de cdigo a una pgina Web, guarde los cambios y actualice la pgina para ver el resultado, debe mostrarse como la figura siguiente:

Si se desea cambiar el tipo de vieta predeterminada, se debe incluir el parmetro TYPE junto con la instruccin <UL>. Por ejemplo, la siguiente lnea de cdigo, aplica el estilo crculo a la lista de vietas. <ul type="circle"> <li>Vieta 1</li> <li>Vieta 2</li> <li>Vieta 3</li>

Sonido y Efectos Domin el sonido. En estudio y vivo Grab bandas. Teora a distancia. www.tamaba.com.arEnlaces patrocinados

<li>Vieta 4</li> </ul> El resultado se muestra a continuacin:

Otro tipo de vietas que puede usarse en una lista es el tipo cuadrado. Para ello, utilice el parmetro TYPE con la expresin square. El siguiente ejemplo aplica vieta de tipo cuadrado a la lista. <ul type="square"> <li>Vieta 1</li> <li>Vieta 2</li> <li>Vieta 3</li> <li>Vieta 4</li> </ul> El resultado se muestra abajo.

Si se desea cambiar el color de la lista con vietas, se debe incluir el parmetro STYLE="Color: nombrecolor". Por ejemplo, la siguiente lnea de cdigo aplica una vieta de tipo cuadrada, con color de texto y vieta azul. <ul type="square" style="color: blue"> Asimismo puede usar la instruccin <Font Color=Color> para modificar el color del texto.

Forma Tu Cuerpo En Mes de Agosto Recibe Descuento Hasta Del 40 y 50 % en las Fajas. clickslp.com/FormaTuCuerpo/FajasEnlaces patrocinados

adems estar anidadas, pudiendo usarse al mismo tiempo tipos diferentes de listas, como en el ejemplo siguiente, que es una lista de definiciones que contiene una lista no ordenada (los ingredientes) y una lista ordenada (los pasos a seguir): Ingredientes:

100 g de harina 10 g de azcar 1 taza de agua 2 huevos sal, pimienta

Pasos a seguir: 1. 2. 3. 4. Notas: Puede aadir uvas para mejorar la receta. La presentacin exacta de los tres tipos de listas depende del agente de usuario. Desaconsejamos a los autores el uso de listas nicamente con el fin de dar sangra al texto. ste es un aspecto estilstico que se se resuelve apropiadamente con hojas de estilo. Mezcle los ingredientes secos ntimamente. Vierta los ingredientes lquidos. Remueva durante 10 minutos. Hornear durante una hora a 300 grados.

10.2 Listas no ordenadas (UL), listas ordenadas (OL) y objetos de lista (LI)
<!ELEMENT <!ATTLIST %attrs; -> <!ELEMENT <!ATTLIST %attrs; -> UL - - (LI)+ UL -- lista no ordenada --> -- %coreattrs, %i18n, %events -- lista ordenada --> -- %coreattrs, %i18n, %events

OL - - (LI)+ OL

Etiqueta inicial: obligatoria, Etiqueta final: obligatoria

<!ELEMENT LI - O (%flow;)* <!ATTLIST LI %attrs; -> -- objeto de lista --> -- %coreattrs, %i18n, %events

Etiqueta inicial: obligatoria, Etiqueta final: opcional Definiciones de atributos

type = informacin de estilo [CI] Desaprobado. Este atributo especifica el estilo de un objeto de lista. Los valores disponibles son para los agentes de usuario visuales. Los valores posibles se describen ms abajo (junto con la informacin sobre las diferencias entre maysculas y minsculas). start = number [CN] Desaprobado. Slo para OL. Este atributo especifica el nmero del primer objeto de una lista ordenada. El nmero inicial por defecto es el "1". Obsrvese que si bien el valor de este atributo es un entero, el rtulo correspondiente puede no ser numrico. As, por ejemplo, cuando el estilo de objeto de lista es de letras latinas maysculas (A, B, C, ...), start=3 significa "C". Cuando el estilo es de numerales romanos en minsculas, start=3 significa "iii", etc. value = number [CN] Desaprobado. Slo para LI. Este atributo establece el nmero del objeto de lista actual. Obsrvese que si bien el valor de este atributo es un entero, el rtulo correspondiente puede no ser numrico (vase el atributo start). compact [CI] Desaprobado. Si est establecido, este atributo booleano indica a los agentes de usuario visuales que representen la lista de un modo ms compacto. La interpretacin de este atributo depende del agente de usuario. Atributos definidos en otros lugares

id, class (identificadores a nivel de documento) lang (informacin sobre el idioma), dir (direccin del texto) title (ttulo del elemento) style (informacin de estilo en lnea) onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (eventos intrnsecos)

Las listas ordenadas y las no ordenadas se representan de idntica manera, excepto en que los agentes de usuario visuales numeran los objetos de las listas ordenadas. Los agentes de usuario pueden presentar estos nmeros de diferentes formas. Las listas no ordenadas no se numeran. Ambos tipos de lista se componen de secuencias de objetos de lista definidos por el elemento LI (cuya etiqueta final puede omitirse). Este ejemplo ilustra la estructura bsica de una lista.
<UL> <LI> ... primer objeto de lista... <LI> ... segundo objeto de lista... ... </UL>

Las listas pueden adems estar anidadas: EJEMPLO DESAPROBADO:

<UL> <LI> ... Nivel uno, nmero uno... <OL> <LI> ... Nivel dos, nmero uno... <LI> ... Nivel dos, nmero dos... <OL start="10"> <LI> ... Nivel tres, nmero uno... </OL> <LI> ... Nivel dos, nmero tres... </OL> <LI> ... Nivel uno, nmero dos... </UL>

Detalles sobre el orden de los nmeros. En las listas ordenadas, no es posible reanudar automticamente la numeracin de una lista donde acab una lista anterior, as como tampoco ocultar la numeracin para un objeto de la lista. Sin embargo, los autores pueden inicializar el nmero de un objeto de la lista estableciendo su atributo value. La numeracin de los objetos de lista subsiguientes contina a partir del nuevo valor. Por ejemplo:
<ol> <li value="30"> hace que ste sea el objeto de lista nmero 30. <li value="40"> hace que ste sea el objeto de lista nmero 40. <li> hace que ste sea el objeto de lista nmero 41. </ol>

10.3 Listas de definiciones: los elementos DL, DT y DD

<!-- listas de definiciones - DT para el trmino, DD para su definicin --> <!ELEMENT DL - - (DT|DD)+ <!ATTLIST DL %attrs; -> -- lista de definiciones --> -- %coreattrs, %i18n, %events

Etiqueta inicial: obligatoria, Etiqueta final: obligatoria

<!ELEMENT DT - O (%inline;)* <!ELEMENT DD - O (%flow;)* --> <!ATTLIST (DT|DD) %attrs; -> -- trmino definido --> -- descripcin de la definicin -- %coreattrs, %i18n, %events

Etiqueta inicial: obligatoria, Etiqueta final: opcional Atributos definidos en otros lugares

id, class (identificadores a nivel de documento) lang (informacin sobre el idioma), dir (direccin del texto) title (ttulo del elemento) style (informacin de estilo en lnea)

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (eventos intrnsecos)

Las listas de definiciones slo difieren levemente de los otros tipos de listas, en que los objetos de lista consisten en dos partes: un trmino y una descripcin. El trmino viene dado por el elemento DT y est restringido a contenido en lnea. La descripcin viene dada por un elemento DD que contiene contenido en bloque. Aqu tenemos un ejemplo:
<DL> <DT>Dweeb <DD>persona joven y excitable que puede madurar y convertirse en un <EM>Nerd</EM> o en un <EM>Geek</EM> <DT>Hacker <DD>un programador inteligente <DT>Nerd <DD>tcnicamente brillante pero socialmente intil </DL>

Aqu tenemos un ejemplo con trminos y definiciones mltiples:

<DL> <DT>Center <DT>Centre <DD> A point equidistant from all points on the surface of a sphere. <DD> In some field sports, the player who holds the middle position on the field, court, or forward line. </DL>

Otra aplicacin de DL es, por ejemplo, dar formato a un dilogo, de modo que cada DT identifica al hablante, y cada DD contiene sus palabras.

10.3.1 Representacin visual de las listas

Nota. Lo que sigue es una descripcin informativa del comportamiento de algunos agentes de usuario visuales al dar formato a las listas. Las hojas de estilo permiten un mejor control sobre formato de las listas (p.ej., su numeracin, convenciones dependientes del idioma, sangras, etc.). Los agentes de usuario visuales suelen sangrar la listas anidadas segn su nivel de anidamiento. Tanto para OL como para UL, el atributo type especifica las opciones de representacin para los agentes de usuario visuales.

Para el elemento UL, los valores posibles del atributo type son disc (disco), square (cuadrado), y circle (crculo). El valor por defecto depende del nivel de anidamiento de la lista actual. Estos valores no distinguen entre maysculas y minsculas. El modo en que se presenta cada valor depende del agente de usuario. Los agentes de usuario deberan intentar presentar un "disc" como un pequeo crculo relleno, un "circle" como un pequeo crculo vaco, y un "square" como un pequeo cuadrado vaco. Un agente de usuario grfico podra hacer las siguientes representaciones: para el valor "disc" para el valor "circle" para el valor "square" Para el elemento OL, los valores posibles del atributo type se resumen en la siguiente tabla (la diferencia entre maysculas y minsculas es importante): Tipo 1 a A i I Estilo de numeracin nmeros arbigos alfabtica en minsculas alfabtica en maysculas nmeros romanos en minsculas nmeros romanos en maysculas

1, 2, 3, ... a, b, c, ... A, B, C, ... i, ii, iii, ... I, II, III, ...

Obsrvese que el atributo type est desaprobado y que los estilos de las listas deberan especificarse mediante hojas de estilo. Por ejemplo, usando CSS se puede especificar que el estilo de los nmeros de los objetos de lista de una lista numerada debera ser numerales romanos en minsculas. En el extracto de a continuacin, todos los elementos OL que pertenezcan a la clase "conromanos" tendrn numerales romanos delante de los objetos de la lista.
<STYLE type="text/css"> OL.conromanos { list-style-type: lower-roman } </STYLE> <BODY> <OL class="conromanos"> <LI> Paso uno ... <LI> Paso dos ... </OL> </BODY>

La representacin de una lista de definiciones tambin depende del agente de usuario. El ejemplo:
<DL>

<DT>Dweeb <DD>persona joven y excitable que puede madurar y convertirse en un <EM>Nerd</EM> o un <EM>Geek</EM> <DT>Hacker <DD>un programador inteligente <DT>Nerd <DD>tcnicamente brillante pero socialmente intil </DL>

podra representarse como sigue:

Dweeb persona joven y excitable que puede madurar y convertirse en un Nerd o un Geek Hacker un programador inteligente Nerd tcnicamente brillante pero socialmente intil

10.4 Los elementos DIR y MENU

DIR y MENU estn desaprobados. Vase el DTD Transicional para su definicin formal. Atributos definidos en otros lugares

id, class (identificadores a nivel de documento) lang (informacin sobre el idioma), dir (direccin del texto) title (ttulo del elemento) style (informacin de estilo en lnea) onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (eventos intrnsecos)

El elemento DIR fue diseado para crear listas multicolumna de directorios. El elemento MENU fue diseado para listas de men de una sola columna. Ambos elementos tienen la misma estructura que UL, y nicamente vara su representacin. En la prctica, un agente de usuario representar una lista DIR o MENU exactamente igual que una lista UL. Recomendamos encarecidamente usar UL en lugar de estos elementos.

Mi pgina del Web

Esta es mi pgina del Web. No es muy extensa, pero tiene todos los elementos bsicos. Espero que os guste. Poco a poco le ir aadiendo ms cosas interesantes.

Mis aficiones Mis pginas favoritas

Un lugar ideal para mis vacaciones

Una de mis aficiones favoritas son los juegos tipo "Doom", con los que paso horas incontables.

EJEMPLO DE TABLA Estos ltimos cuatro atributos descritos son de gran utilidad. Concretamente, height y width nos ayudan a definir las dimensiones de nuestras celdas de una forma absoluta (en pixels o puntos de pantalla) o de una forma relativa, es decir por porcentajes referidos al tamao total de la tabla. Podis leer un articulo interesante a propsito de estas dos modalidades de diseo en nuestro manual de usabilidad. A titulo de ejemplo: <td width="80"> Dar una anchura de 80 pixels a la celda. Sin embargo, <td width="80%"> Dar una anchura a la celda del 80% de la anchura de la tabla. Hay que tener en cuenta que, definidas las dimensiones de las celdas, el navegador va a hacer lo que buenamente pueda para satisfacer al programador. Esto quiere decir que puede que en algunas ocasiones el resultado que obtengamos no sea el esperado. Concretamente, si el texto presenta una palabra excesivamente larga, puede que la anchura de la celda se vea aumentada para mantener la palabra en la misma lnea. Por otra parte, si el texto resulta muy largo, la celda aumentara su altura para poder mostrar todo su contenido. Anlogamente, si por ejemplo definimos dos anchuras distintas a celdas de una misma columna, el navegador no sabr a cual hacer caso. Es por ello que resulta conveniente tener bien claro desde un principio como es la tabla que queremos disear. No esta de ms si la prediseamos en papel si la complejidad es importante. El HTML resulta en general fcil pero las tablas pueden convertirse en un verdadero quebradero de cabeza si no llegamos a comprenderlas

debidamente. Los atributos rowspan y colspan son tambin utilizados frecuentemente. Gracias a ellos es posible expandir celdas fusionando stas con sus vecinas. El valor que pueden tomar estas etiquetas es numrico. El nmero representa la cantidad de celdas fusionadas. As, <td colspan="2"> Fusionara la celda en cuestin con su vecina derecha. Esta celda tiene un colspan="2" Celda normal Del mismo modo, <td rowspan="2"> Esta celda tiene rowspan="2", por eso tiene fusionada la celda de abajo. Celda Normal Otra celda normal Otra celda

Expandir la celda hacia abajo fusionndose con la celda inferior. El resto de los atributos presentados presentan una utilidad y uso bastante obvios. Los dejamos a vuestra propia investigacin.