Ficha 2 de HTML

HTML A continuación, encontrarás las etiquetas básicas para que te familiarices con
Área N_GS Docente(s) ellas y vayas identificándolas poco a poco.

ET S2_ABC Eva María Frisancho V
html
CONSIGNA: Imprime y pega en tu cuaderno las fichas.
<html> es la que debe usarse en todos los códigos porque indica a los navegadores que
¿Qué son los códigos html para páginas web? el documento tiene código html para que pueda leerlo de esa forma.
Los códigos html son el lenguaje universal que se utiliza para programar y Título
elaborar sitios web. <tittle> es la etiqueta que le da un título a la página web, de esta manera el sitio tendrá
Las siglas html significan “Hyper Text Markup Language” o Lenguaje Marcado de un nombre con el cual los usuarios puedan identificarlo.
Hipertexto. Este tipo de códigos genera sitios web estáticos, aunque usados con otros
lenguajes de programación se pueden crear sitios dinámicos. Encabezado
Este lenguaje se compone de etiquetas en serie que los navegadores traducen en <head> es la etiqueta que se utiliza para el encabezado de la página. Su principal
la pantalla como: función es contener toda la información del funcionamiento del sitio. Debido a esto es un
código encriptado que las personas que visualizan la página no pueden ver.
Imágenes, Texto, Hipervínculos, Listas de palabras y Tablas de tabulación.
Usando diferentes etiquetas se puede crear una página web estructurada y Cuerpo
organizada con un contenido visible en cualquier pantalla. <body> es la etiqueta que se usará en todo el sitio. Te ayudará a agregar texto,
imágenes, videos o cualquier otra funcionalidad que desees agregar como contenido.
¿Cómo funcionan?
Para que un texto o una imagen puedan leerse en este tipo de códigos, siempre
Títulos y subtítulos
debe tener una etiqueta de inicio y una de cierre. Por ejemplo, para el título de un sitio <h1> <h2> <h3> … <h6> son etiquetas que funcionan para agregar títulos y subtítulos
sería: a la página web. Se utilizan después de la etiqueta <body> para seguir con la
organización del sitio.
<html> <tittle> Diseño de páginas </html> </tittle>
Imágenes
De no contar con una etiqueta de cierre entonces no podría visualizarse el título <img> con esta etiqueta podrás agregar imágenes al cuerpo de tu página. Lo único que
porque el navegador no podría leerla como nosotros deseamos. Simplemente la página tienes que hacer es agregar la etiqueta <img> después de la etiqueta <body>.
aparecería como error. Hay dos formatos de imágenes que todos los navegadores modernos reconocen.
Por esto es muy importante conocer la naturaleza de los códigos html, su función Son las imágenes GIF y JPG.
y qué deseamos construir con cada uno de ellos. La directiva <IMG> tiene varios parámetros:
src = "imagen"
Hipervínculos
¿Cómo usar los códigos html? <a> esta etiqueta se agrega para insertar un hipervínculo a la página. Por ejemplo, el link
hacia tus redes sociales o hacia otro sitio web con el que desees conectar tu página.
Para crear una página web completa debes hacer uso de documentos html para
poder tener organizados todos los códigos que vayas a usar. Este documento es un
LINKS INTERNOS
archivo con una extensión .html y puede realizarse en el editor de textos de tu
preferencia.
TIPOS DE CÓDIGOS HTML PARA PÁGINAS WEB Agregar listas
<li> <ul> sirven para agregar listas para crear menús en tu sitio que te dirijan a otras
Existen diferentes tipos de códigos básicos que puedes usar para tu página web. páginas dentro de él. Con estas etiquetas le darás secuencia a todo tu contenido, pues
Los principales son los que le dan forma al título, al cuerpo de la página y a las imágenes los usuarios podrán ir de una página a otra sin problema alguno.
y videos.
Listas ordenadas
Las listas ordenadas constan de una sola marca de apertura y cierre 2. Hay dos códigos: hexadecimal –lo más habitual– o RGB. En ambos casos
<OL></OL> y tantas marcas de lista como voces hay en el menú <LI>. La sintaxis se trata de expresar las proporciones de tres colores básicos: rojo, verde y azul.
correcta para elaborar listas ordenadas es: 3. Los valores hexadecimales de los tres colores se expresan de la
<ol type="i"> siguiente manera:
<li>Perro</li> a) Rojo: color:#ff0000;
<li>Gato</li> b) Verde: color:#00ff00;
<li>Periquito</li> c) Azul: color:#0000ff;
</ol>
Listas desordenadas Los colores más básicos pueden especificarse sin código, simplemente
Las listas desordenadas constan de una sola marca de apertura y cierre escribiendo la palabra correspondiente (por supuesto en inglés). Por ejemplo: <FONT
<UL></UL> y tantas marcas de lista como voces hay que ordenar <LI>. La sintaxis COLOR="blue">...</FONT>, <FONT COLOR="red">...</FONT>, etc.
correcta para definir una lista desordenada es:
<ul type="circle"> Se puede especificar el tamaño de la fuente con la etiqueta <FONT
<li>Perro</li> SIZE="?">...</FONT>. El valor del tamaño ("?") deseado puede suministrarse de
<li>Gato</li> manera absoluta (un número del 1 al 7) o relativa (+1, +2, -1, -2, etc., teniendo en cuenta
<li>Periquito</li> que el valor por defecto es 3).6
</ul>
 La etiqueta básica, que controla el tipo de fuente utilizado, es <FONT>. Todas estas etiquetas se pueden combinar, de modo que con una sola se controla,
 <FONT> es una etiqueta pareada. Por tanto, afecta a los caracteres introducidos por ejemplo, el tipo, el tamaño y el color de los caracteres: <FONT
entre <FONT> y </FONT>. Pero sin más especificaciones, la etiqueta aún no FACE="Arial" COLOR="#0000FF" SIZE="5">...</FONT>
sirve para nada.
 Se puede especificar el tipo de letra (es decir, la fuente de caracteres) EJEMPLO 3
añadiéndolo a la etiqueta, de la siguiente manera (en este caso, la fuente
<HTML>
escogida es Arial): <FONT FACE="Arial">...</FONT>.
 Se puede especificar el color de la fuente con la etiqueta <FONT <HEAD>
COLOR="?">...</FONT>. Para especificar los colores, conviene saber al <TITLE>Ejemplo 3</TITLE>
menos lo siguiente: </HEAD>
<BODY>
1. Cada color posee su correspondiente código, este código de color se Esto es texto simple: cada navegador lo visualizará
antecede del símbolo # según su configuración por defecto.
Estos números están en numeración hexadecimal. Esta numeración se
caracteriza por tener 16 dígitos (en lugar de los 10 habituales). Estos dígitos son: <FONT SIZE="1">Este texto es tamaño 1.</FONT>
<FONT SIZE="2">Este texto es tamaño 2.</FONT>
0123456789ABCDEF <FONT SIZE="4">Este texto es tamaño 4.</FONT>
Es decir, que en nuestro caso, el número menor es el 00 y el mayor el FF. <FONT SIZE="+1">Este texto es tamaño +1 (que es
Combinando las proporciones de cada color primario obtendremos diferentes colores. lo mismo que tamaño 4).</FONT>
Ejemplos: <FONT FACE="Arial" SIZE="5"
#000000 Color Negro COLOR="FFFF00">Este texto posee varias
#FF0000 Color Rojo
especificaciones de formato.</FONT>
#00FF00 Color Verde
#0000FF Color Azul </BODY>
#FFFFFF Color Blanco </HTML>
OJO:
Es normal utilizar varias etiquetas para un mismo elemento de texto. En ese
caso, hay que tener cuidado para encajarlas correctamente. Por ejemplo:
<FONT FACE="Courier"><B><I>...</I></B></FONT> es correcto, pero
<FONT FACE="Courier"><B><I>...</FONT><B></I> es incorrecto.
El primer par de cifras indican la proporción de color Rojo, el segundo par de

cifras la proporción de color Verde y, las dos últimas, la proporción de color Azul.
Códigos de html básicos

Crear un formulario:
Con este código podemos crear un formulario para que complete el visitante. Por
ejemplo un libro de visitas, luego que el visitante apriete el botón enviar, los datos serán
enviados a tu casilla de correo.
<H2>Libro de visitas</H2>
<FORM ACTION="mailto:tunombre@tuservidor.com" METHOD="post">
<TABLE>
<TD ALIGN=RIGHT>Nombre:</TD>
<TD><INPUT type="text" size=36 name="nombre"></TD>
<TR><TD ALIGN=RIGHT>Direccion E-mail:</TD>
<TD><INPUT type="text" size=36 name="direccion"></TD>
<TR><TD ALIGN=RIGHT>como llegaste hasta esta pagina?</TD>
<TD><INPUT type="text" size=36 name="procedencia"></TD>
<TR><TD ALIGN=RIGHT>Tus comentatios:</TD>
<TD><TEXTAREA rows=5 cols=30 name="comentarios"></TEXTAREA></TD>
</TABLE>
<INPUT type="reset" value="Borrar todo"> <INPUT type="submit" value="Enviar">
</FORM>

Ficha 2 de HTML

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Ficha 2 de HTML

Încărcat de

Drepturi de autor:

Formate disponibile

HTML A continuación, encontrarás las etiquetas básicas para que te familiarices con

Área N_GS Docente(s) ellas y vayas identificándolas poco a poco.

El primer par de cifras indican la proporción de color Rojo, el segundo par de

Códigos de html básicos

<INPUT type="reset" value="Borrar todo"> <INPUT type="submit" value="Enviar">

S-ar putea să vă placă și