Confía en TIC: HTML

HTML

Tablas:

Tener en cuenta al trabajar TABLAS los siguientes comandos o instrucciones:

MARCA - COMANDO	LA MARCA REALIZA:
<TABLE BORDER="5" bgcolor ="blue" >	Colocar color de fondo a la tabla
<TD> <IMG SRC="nubes2.jpg"> </TD>	Colocar una imagen en una celda de la tabla
<TR BGCOLOR="#DB70DB"> <TD> TEXTO </TD> <TD> TEXTO </TD> <TD> TEXTO </TD> </TR>	Ponerle color de fonfo a una fila
<TR BGCOLOR="RED"> <th>Hora </th> <th>Lunes </th> <th>Martes </th> </tr>	Primera fila de una tabla. Es el encabezado de la tabla – aparece el texto como si fuera título.

Crear tablas

<TR> <TD> TRES </TD> <TD> CUATRO </TD> </TR>

<TR> <TD> CINCO </TD> <TD> SEIS </TD> </TR>

</TABLE>

EXPLICACIÓN

<TR> …. </TR> crear un registro en la tabla R= row=renglón

<TD> dato en cada celda </TD> crea cada celda de la tabla – es decir el número de columnas.

Para el ejemplo es una tabla de _3_ filas y _2_ columnas. CELDAS= 3F * 2C = 6 celdas.

Imágenes:

Colocar una imagen en el cuerpo de la página

EXPLICACIÓN

El comando <IMG SRC="nombre de la imagen y la extensión del archivo" > sirve para colocar una imagen en el cuerpo de la página. Es necesario siempre crear una carpeta para archivar los archivos HTML y las imágenes que se van a trabajar. Todos en un mismo sitio, tener en cuenta el tipo de imagen para escribir bien el nombre del archivo. (jpg, png, gif tipos de imagen que se pueden trabajar en html). WIDTH="numero" es el ancho de la imagen, siempre y cuando se pueda modificar.

Vínculos:

El hipervínculo es el elemento más importante del HTML, ya que es el que realmente permite "navegar" por uno o varios documentos. Los usuarios podrán navegar por las páginas haciendo clic con el ratón sobre las zonas activas o subrayadas. Estas zonas activas pueden corresponder a un grupo de caracteres o una imagen.

Por esto el elemento más importante que tiene una página de internet es el hipervínculo, estos nos permiten cargar otra página en el navegador. Normalmente un navegador al encontrar esta marca muestra un texto subrayado, y al hacer clic con el mouse sobre éste el navegador carga la página indicada por dicho hipervínculo.

Crear vínculo a una dirección de internet

<a href = "https://www.google.com.co"> ir a google </a>

EXPLICACIÓN

Crear un hipervínculo a una dirección en internet, es necesario escribir completo el link para asegurar que va a funcionar https://......

<a href = "https://www.google.com.co"> ir a google </a>

<a href….> è Marca que permite hacer hipervínculos

"https://.....” è Dirección a la cual quiero acceder

<a … > ir a google è Texto que sale subrayado que me indica que hay un vínculo.

</a> è Cerrar la marca del hipervínculo

Crear vínculo a una página HTML

<a href = "clase03.html"> ir a otra pagina </a>

EXPLICACIÓN

"clase03.html" es el nombre de la página con la que quiero crear el vínculo

ir a otra pagina es el Texto que sale subrayado que me indica que hay un vínculo a otra página del sitio WEB.

Todas las páginas e imágenes que me van a permitir crear el sitio WEB deben estar en una misma carpeta.

Vinculo en la misma página.

<html>

<head>

</head>

<body>

<h1>opcion HREF de html </h1>

<a href="#introduccion"> titulo de Introducción</a><br>

<a href="#opcion dos">segunda opcion</a><br>

<a href="#opcion tres">tercera opcion</a><br>

<a href="#opcion cuatro">Cuarta opción</a><br>

<h2>titulo de Introducción</h2>

<p>

datos de la introduccion ......... etc.<br>

mas renglones de la primera opcion...... <br>

</p>

<h2>segunda opcion</h2>

<p>

aca inicia el segundo parrafo......<br>

mas renglones de la segunda opcion...... <br>

</p>

<h2>tercera opcion</h2>

<p>

aca inicia el tercer parrafo......<br>

mas renglones de la tercera opcion...... <br>

</p>

<h2>Cuarta opción</h2>

<p>

aca inicia el cuarto parrafo......<br>

mas renglones de la cuarta opcion...... <br>

</p>

</body>

</html>

Vincular paginas abriéndolas en una nueva ventana.

Fuentes:

<body bgcolor="XXXXXX">	Color de fondo del cuerpo de la página.
<CENTER> PALABRA </CENTER>	Centrar una palabra
<body background = "XXXXXX" >	Color imagen de fondo en el cuerpo de la página.
<h6> palabra </h6>	Texto como título tamaño 6
<br>	Enter – salto de línea
<P ALIGN="RIGHT"> XXXX </P>	Alinear el texto a la derecha
<HR COLOR="XXXXX" SIZE = "###">	Una línea de un color y un tamaño determinado.
<IMG SRC="XXXXX" >	Colocar una imagen en el cuerpo de la página.
<hr>	Una línea horizontal
<font color="XXXXX"> PALABRA </font>	Un texto de un color de fuente especifico.
<font face ="XXXX"> PALABRA </font>	Un texto de un tipo de fuente especifico.
<font size ="XXXXXX"> PALABRA </font>	Un texto de un tamaño de fuente especifico.
<font color="XXXXX"> <font face ="XXXX"> <font size ="XXXXXX"> PALABRA </font>	Un texto de un color, un tipo y un tamaño de fuente especifico.
<u> PALABRA </u>	Texto subrayado
<b> PALABRA </b>	Texto en negrilla
<s> PALABRA </s>	Texto tachado
<IMG SRC="XXXXX" WIDTH="###">	Colocar una imagen en el cuerpo de la página redimensionándole el ancho.
<h2> <font face ="XXXXX"> <font color="XXXXX"> palabra </font> </h2>	Texto como título tamaño 2 con un tipo de fuente y un color de la fuente especifico.
<! H O L A	Comentario.
<P ALIGN="left"> XXXX </P>	Alinear el texto a la izquierda

Etiquetas nos permiten cambiar el aspecto de la letra:

<b>...</b> Pone el texto en negrita.

<i>...</i> Representa el texto en cursiva.

<u>...</u> Para subrayar algo.

<s>...</s> Para tachar.

Tipos de letra, tamaño y colores:

<font color="red"> TEXTO </font>

<font size="2"> TEXTO </font>

<font face="Arial"> TEXTO </font>

ALGUNOS COLORES QUE SE PUEDEN USAR:Black, Silver, Gray, White, Maroon, Red, Purple, Fuchsia, Green, Lime, Olive, Yellow, Navy, Blue, Teal, Aqua

EL TAMAÑO es SIZE: Se pueden trabajar con valores desde 1 a 7. También se puede utilizar los modificadores + y - para indicar un incremento (o decremento) relativo del tamaño del tipo de letra.

Confía en TIC

miércoles, 3 de mayo de 2017

HTML

HTML

No hay comentarios:

Publicar un comentario

Archivo del blog