Los elementos mas importantes de HTML

Html, contiene aproximadamente 85 elementos distintos. Pero solo veremos los mas importantes.

1.- div: Dividir la página en secciones.
Sintaxis:
< div >
Texto
Cualquier Texto
Y Otro mas
< /div >

Para poder distinguir las secciones en el código fuente, se le asigna un nombre único mediante el atributo id. ejemplo
< div id="encabezado"> < /div >

2.- Titulos: h1 a h6. Mediante el uso de titulos, párrafos y listas podemos ofrecer puntos en los que el usuario puede fijar la vista en su recorrido por el texto.

Ejemplo: < h1 > Ejemplo de Texto < /h1 >

3.- Parrafos: p de paragraph.
Elemento mas utilizado en html. Cualquier parrafo comienza con < p > y termina < /p >.

Ejemplo: < p > Diseño de paginas web con CSS. Fundamentos < /p >

4.- Resaltar texto: strong y em
Estan pensados para resaltar texto. Son elementos inline, por lo que solamente son tan anchos como el texto y no crean ningun salto de linea
*strong significa muy resaltado y por lo general los navegadores lo representan como negrita.

* em significa emphasize, enfatizar. em se suele representar en cursiva

ejemplo:
< p > Las páginas web están compuestas de < strong >cuadros rectangulares< strong > que se suelen colocar < em >unos juntos a otros.< em >

5.- Viñetas y numeraciones. Una lista esta compuesta por dos elementos en html:
* < ul > y < /ul > identifican el principio y el final de la lista con viñetas.
* < li > y < /li > marcan todos los elementos dentro de la lista.

ul significa "unordered list", es decir, "lista no ordenada".

< ul > le indica al navegador "aqui empieza una lista no ordenada". Entre < li > y < /li > se encuentran los distintos elementos de la lista antes de que ésta termine con < /ul >.

6.- Numeraciones: listas ordenadas con ol y li
Las listas ordenadas ("ordered lists") se suelen conocer como numeraciones. Su construcción es idéntica a la de las listas no ordenadas. pero ul se sustituye por ol.

7.- Skip-Link (1): un hipervinculo para saltar la navegación.
hipervinculo que salte a otro punto de la misma página web. Los usuarios que lean la página tienen que pasar previamente por toda la navegación antes de llegar al contenido propiamente dicho. Sin embargo, con skip-link el usuario puede saltarse la navegación.

Skip-Link(2): Hipervinculo para volver arriba.
Si tenemos una pagina muy larga y queremos ofrecer a los usuarios un enlace para volver arriba, podemos utilizar la misma tecnica.

ejemplo: < a href="#wrapper" > Arriba< /a > Este vinculo salta al elemento < div id="wrapper" >

8.- Ruta de acceso a la imagen: img.

El elemento para insertar una imagen se llama img, abreviatura de image. No existe un tag de cierre. en su lugar se utiliza un espacio en blanco, una barra y el signo mayor que.

< img scr="logo.gif" alt="Little Boxes" widh="222" height="32" />

9.- Otros elementos utiles.

Nueva Linea: < br />
address para direcciones
blockquote y cite para citas
span es un elemento inline neutro
character Entities: caracteres especiales

**** LAS TABLAS NO ESTAN PROHIBIDAS ****

Durante mucho tiempo, las tablas fueron la única opción disponible para posicionar objetos en una pagina web. CSS ha tomado el relevo y ahora las tablas se utilizan para su propósito inicial: para representar datos en forma de tabla.

< table border="1" >
< tr >
< td > Fila 1, Columna1 < /td >
< td > Fila 1, Columna2 < /td >
< /tr >
< tr >
< td > Fila 2, Columna1 < /td >
< td > Fila 2, Columna2 < /td >
< /tr >
< /table >

¿Todo correcto? Dejemos que un experto en gramatica de Html verifique nuestras instrucciones. Podemos hacerlo en la siguiente dirección.

http://validator.w3.org/

CSS para probar: los w3c core styles

Para ver darnos una idea de las posibilidades de CSS revisa la página:

http://csszengarden.com/