martes, 13 de marzo de 2012

El lenguaje HTML


HTML es un lenguaje que se utiliza para la creación de página en la WWW.
HTML se compone de una serie de comandos, que son interpretados por el visualizador el que ejecuta todas las ordenes contenidas en el código HTML, de modo que un visualizador puede estar capacitado para una prestaciones, pero no para otras.
MI PRIMER DOCUMENTO HTML
Es recomendable crear un directorio en el ordenador para almacenar las páginas web que vaya haciendo al aprender y que practique un tiempo antes de poner las páginas en Internet.

  1. Abra el directorio de textos: en Windows abra el Block de nOtas
  2. Teclee lo siguiente <html>
    <head>
    <title>Ejemplo1-Miprimera pagina Web </title>
    </head>
    <body>
    <center><hl>Miprimera pagina web</hl></center>
    <hr>
    Esta es mi priemra pagina web.
    <p>aqui va un segundo parrafo</p>
    </body>
    </html>
  3. Grabe este archivo con el nombre: ejemplo1.html
  4. Abra el visualizador. No necesita conectarse a Internet para ver las paginas en su computador. Puede trabajar off-line
  5. Elija “Archivo/Abrir página” en la barra de menú del navegador.

Importante

En internet por lo general una mayúscula es distinta a una minúscula. Como sugerencia es bueno tener todos los archivos en minúsculas.

Etiqueta <img>

No necesita etiqueta de cierre. Esta etiqueta permite mostrar imágenes. El formato básico es :

<img src="imagen.ext">
El autor del HTML puede indicar al navegador que re dimensione la imagen especificando los siguientes atributos:

  • SRC Identifica la imagen que se desplegará.
  • Height Para redimensionamiento de gráfico( en pixeles o porcentaje)
  • Width Para redimensionamiento de gráfico (en pixeles o en porcentaje)
A la imagen se le puede aplicar un borde que se hace notorio cuando se trata de una imagen que además es un hipervínculo;
  • Border Definido en pixeles
La imagen también puede alinearse con respecto al texto:
  • Align Alineación, puede ser: TOP, MIDDLE, BOTTOM, LEFT y RIGHT
En caso de que la imagen no pueda exhibirse, se puede desplegar un texto:
  • Alt Especifica el texto alterno
Tablas

En HTML también podemos incluir tablas. Se deben utilizar varias etiquetas:

Etiqueta <table></table>

Señala el inicio y el final de una tabla. Sus atributos son:

  • Aling Establece la alineación de la tabla o texto mediante ALIGN=LEFT o ALIGN=RIGHT
  • Bgcolor Establece el color de fondo de las celdas de la tabla
  • Border Determina el ancho del borde en pixeles
  • Bordercolor Asigna un color al borde
  • BorderDark Determina el color de la parte oscura de un borde de 3 d
  • BorderLight Asigna el color a la parte clara de un borde de 3d
  • Caption Especifica el titulo de la tabla
  • Cellpadding Establece la cantidad de espacio libre junto al contenido de una celda
  • Cellspacing Asigna la cantidad de espacio entre las celdas de una tabla
  • Width Determina el ancho de la tabla en pixeles o en porcentaje

Etiqueta <th> </th>

Indica al navegador cliente que exhiba el texto como un encabezado en la primera fila de una tabla. Atributos principales:
  • Colspan especifica el numero de celdas que cubre el encabezado
  • Align Determina la posición del texto titilo

Etiqueta <td></td>

La etiqueta de datos de la tabla, es la que identifica a las columnas o celdas específicas de una tabla. Atributos especiales:
  • Align Alineación del texto/objto de la celda
  • Bgcolor Color de fondo de la celda
  • Backgroun Imagen de fondo de una celda
  • Width Ancho de la celda/columna con respecto al ancho de la tabla.




Numeración y Viñetas


Etiqueta <ul> </ul>


Indica al navegador que cree una lista con viñetas no ordenada.


Etiqueta <ol> </ol>


Listas ordenadas, esta etiquetas indica al navegador que numera la lista de elementos comprendidos dentro de las etiquetas <ol>.


Etiqueta <li> </li>


SE usa para indicar al navegador que exhiba el texto que le sigue como un elemento de línea en una lista. Atributos:

Type
Especifica el tipo para listas ordenadas:
Type=A usa mayúsculas
Type=a usa minúsculas
Type=I usa números romanos grandes
Type=i usa números romanos pequeños
Type=1 usa números algebraicos
Value
Indica que se inicie la numeración a partir del numero especificado.








Hipervínculos


Es un botón o una imagen que al hacer clic nos lleva a otra dirección URL, página WEB o recurso.


Etiqueta <A> </A>


Denota el inicio y el final de una instrucción que contiene de alguna forma un vínculo o hipervínculo.
Atributos:
HREF
Recurso al cual se hace referencia al Hipervínculo
NAME
Especifica el nombre de la posición a donde apuntar
TARGET
Destino del enlace










Frames


Ofrece la posibilidad de utilizar marcos.


Etiqueta <frameset> </frameset>


Define la posición gráfica de los marcos en la pantalla.Atributos:

Rows
Determina el alto de las filas
Cols
Determina el ancho de las columnas
Framespacing
Espacio entre frames



Etiqueta <frame> </frame>


Define un solo marco que forma parte del conjunto de marcos definidos en <frameset>. Atributos:
Marginheight
Determina que tanto espacio vertical existe entre el objeto ubicado en un marco y los extremos superior o inferior de este
Margin Width
Determina que tanto espacio horizontal existe entre el objeto ubicado en un marco y los extremos izquierdo o derecho de este
Name
Ofrece la capacidad de dar nombres a las ventanas Frame, de modo que puedan ser utilizados como destino de los hipervínculos
Noresize
Indica que el usuario no puede redimensionar el marco
Scrolling
Habilita una barra de desplazamiento para un marco

SRC
Indica que exhiba un marco el contenido de un documento HTML





Etiqueta <noframes></noframes>


Es usada para desplegar un texto o una página alternativa cuando un navegador no es capaz de desplegar los marcos.


Otras Etiquetas Utiles
Etiqueta de comentarios <!-- -->


Se trata de una etiqueta que es utilizada para realizar comentarios o acotaciones.


Etiqueta de comentarios <comment> </comment>


De igual manera es utilizada para realizar comentarios.


Etiqueta <adress> </adress>


Ofrece una manera de dar formato a un pequeño cuerpo de texto que se asemeje a la rotulación de una carta convencional.

Etiqueta <cite> </cite>

El texto dentro de la etiqueta aparece en cursiva para representar una cita.

Eiqueta <code> </code>

El texto dentro esta etiqueta aparece en una fuente con caracteres mono espaciados cuando se visualiza a través de un navegador.

Etiqueta <credit> </credit>

Se emplea para indicar créditos por el material incluido en un documento.

Etiqueta <em> </em>

Indica que se debe dar énfasis al texto que se contiene. El navegador resaltará este texto con negrillas e inclinación itálica.

Etiqueta <kbd></kbd>

Indica al navegador que interprete el texto especificado en una fuente en negritas de ancho fijo.

Etiqueta <nobr> </nobr>

Impide que el navegador inserte un salto de línea, incluso cuando es adecuado.

Etiqueta <p> </p>

Indica el inicio y final de oraciones a exhibir en un solo párrafo.

Etiqueta <pre> </pre>

Significa texto pre formateado y se usa para conservar espacios y saltos de línea en lo cuerpos de texto.

Etiqueta <s></s> o <strike></strike>

Instruye al navegador que tache el texto incluido entre las etiquetas.

Etiqueta <strong> </strong>

Hace que el navegador exhiba el texto en negritas.

Etiqueta <sub> </sub>

Instruye al navegador que exhiba el texto especificado como subíndice.

Etiqueta <sup></sup>

Indica al navegado que exhiba el texto especificado como super índice.

Etiqueta <tt> </tt>

Instruye al navegador que exhiba el texto especificado en una fuente de ancho fijo.

Etiqueta <var> </var>

Indica la navegador que exhiba el texto especificado en una fuente mas pequeña, de ancho fijo.

Atributo ="fixed" del BODY

Indica a su navegador Internet explorer que mantenga el fondo constante y no móvil de forma vertical.


 
Publicado por en

No hay comentarios:

Publicar un comentario

Suscribirse a: Enviar comentarios (Atom)