Fundamentos de html2

Índice
 HTML
 Pagina web
 Tabla de colores en html
 Fundamentos de html
 Funciones básicas de html
 Alineación y espaciado
 Listas
 Elementos y modificación de fuente
HTML
HTML: siglas de HyperText Markup Language (Lenguaje de Marcas de

Hipertexto), es el lenguaje de marcado predominante para la construcción de
páginas web. Es usado para describir la estructura y el contenido en forma de
texto, así como para complementar el texto con objetos tales como imágenes.
HTML se escribe en forma de "etiquetas", rodeadas por corchetes angulares (<,>).
HTML también puede describir, hasta un cierto punto, la apariencia de un
documento, y puede incluir un script (por ejemplo Javascript), el cual puede afectar
el comportamiento de navegadores web y otros procesadores de HTML.
HTML también es usado para referirse al contenido del tipo de MIME text/html o
todavía más ampliamente como un término genérico para el HTML, ya sea en
forma descendida del XML (como XHTML 1.0 y posteriores) o en forma
descendida directamente de SGML (como HTML
Pagina web
Una página web, también conocida como página de Internet, es un documento

adaptado para la Web y que normalmente forma parte de un sitio web. Su principal
característica son los hiperenlaces a otras páginas, siendo esto el fundamento de
la Web.
Una página web está compuesta principalmente por información (sólo texto o
multimedia) e hiperenlaces; además puede contener o asociar datos de estilo para
especificar cómo debe visualizarse, o aplicaciones embebidas para hacerla
interactiva.
Las páginas web son escritas en un lenguaje de marcado que provea la capacidad
de insertar hiperenlaces, generalmente HTML.
El contenido de la página puede ser predeterminado ("página web estática") o

generado al momento de visualizarla o solicitarla a un servidor web ("página web
dinámica"). Las páginas dinámicas que se generan al momento de la visualización
se hacen a través de lenguajes interpretados, generalmente JavaScript, y la
aplicación encargada de visualizar el contenido es la que debe generarlo. La
páginas dinámicas que se generan al ser solicitadas son creadas por una
aplicación en el servidor web que alberga las mismas.
Respecto a la estructura de las páginas web algunos organismos, en especial el

W3C, suelen establecer directivas con la intención de normalizar el diseño para
facilitar y simplificar la visualización e interpretación del contenido.
Tabla de colores en html
En HTML, los colores se definen mediante tres números hexadecimales que

representan los tonos rojo, azul y verde, usando la codificación RGB) del color
elegido. Esta es la sintaxis para codificar un color en HTML:
color="#RRGGBB"
RR, GG y BB representan, cada uno, un número hexadecimal entre 00 y FF para
el rojo, el verde y el azul respectivamente.
Con esta sintaxis, se pueden utilizar más de 16 millones de colores en las páginas
Web. Sin embargo como no todos los navegadores reconocen los colores del
mismo modo, W3C recomienda usar los colores a continuación, que han recibido
nombres específicos. Por lo tanto, puede (y se aconseja) representar los colores
de esta forma:
Funciones HTML básicos
<html>: define el inicio del documento HTML, le indica al navegador

que lo que viene a continuación debe ser interpretado como código
HTML. Esto es así de facto, ya que en teoría lo que define el tipo de
documento es el DOCTYPE, significando la palabra justo tras
DOCTYPE el tag de raíz, por ejemplo:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<script>: incrusta un script en una web, o se llama a uno mediante

src="uri del script" Se recomienda incluir el tipo MIME en el atributo
type, en el caso de JavaScript text/javascript.
<head>: define la cabecera del documento HTML, esta cabecera

suele contener información sobre el documento que no se muestra
directamente al usuario. Como por ejemplo el título de la ventana del
navegador. Dentro de la cabecera <head> podemos encontrar:
Un ejemplo de código HTML con coloreado de sintaxis
<title>: define el título de la página. Por lo general, el título aparece

en la barra de título encima de la ventana
<link>: para vincular el sitio a hojas de estilo o iconos Por

ejemplo:<link rel="stylesheet" href="/style.css" type="text/css">
<style>: para colocar el estilo interno de la página; ya sea usando

CSS, u otros lenguajes similares. No es necesario colocarlo si se va
a vincular a un archivo externo usando la etiqueta <link>
<meta>: para metadatos como la autoría o la licencia, incluso para

indicar parámetros http (mediante http-equiv="") cuando no se
pueden modificar por no estar disponible la configuración o por
dificultades con server-side scripting.
<body>: define el contenido principal o cuerpo del documento. Esta

es la parte del documento html que se muestra en el navegador;
dentro de esta etiqueta pueden definirse propiedades comunes a
toda la página, como color de fondo y márgenes. Dentro del cuerpo
<body> podemos encontrar numerosas etiquetas. A continuación se
indican algunas a modo de ejemplo:
<h1> a <h6>: encabezados o títulos del documento con diferente

relevancia.
<table>: define una tabla
<tr>: fila de una tabla
<td>: columna de de una tabla
<a>: Hipervínculo o enlace, dentro o fuera del sitio web. Debe

definirse el parámetro de pasada por medio del atributo href. Por
ejemplo: <a href="http://www.wikipedia.org">Wikipedia</a> se
representa como Wikipedia)
<div>: división de la página. Se recomienda, junto con css, en vez de

<table> cuando se desea alinear contenido
<img>: imagen. Requiere del atributo src, que indica la ruta en la que
se encuentra la imagen. Por ejemplo: <img
src="./imagenes/mifoto.jpg" />. Es conveniente, por accesibilidad,
poner un atributo alt="texto alternativo".
<li><ol><ul>: Etiquetas para listas.
: texto en negrita (Etiqueta desaprobada. Se recomienda usar la

etiqueta )
: texto en cursiva (Etiqueta desaprobada. Se recomienda usar la

etiqueta )
<s>: texto tachado (Etiqueta desaprobada. Se recomienda usar la

etiqueta <del>)
: texto subrayado
La mayoría de etiquetas deben cerrarse como se abren, pero con una barra ("/")
tal como se muestra en los siguientes ejemplos:
<table><tr><td>Contenido de una celda</td></tr></table>
<script>Código de un [[script]] integrado en la página</script>.

Fundamentos de html
Los componentes del HTML
El propósito de este capítulo es introducir a los tres componentes fundamentales

del HTML y un apartado independiente sobre "caracteres especiales". Otras partes
del estándar HTML 4.0, como las joras de estilo, usan otros métodos sintácticos,
pero serán explicados más tarde. Por ahora, vamos a centrarnos en los pilares de
los componentes del HTML y extraeremos una sólida noción de ellos.
El pilar central de todo HTML es la etiqueta (técnicamente se refiere como un

elemento). Una etiqueta (tag en inglés) es el identificador del HTML; dice "haz
esto". Pero las etiquetas se hacen más potentes con modificaciones, y esa
modificación empieza con un atributo (también conocido como un argumento).
Los atributos son como los verbos en cuando que proporcionan actividad, con
ellos, la etiqueta HTML puede de repente adquirir vida y hacer algo en cierta
manera.
EN CONSTRUCCIÓN DESDE AQUÍ

Lo primero que hay que saber es el funcionamiento de los documentos HTML, que
significa Hyper Text Markup Language. Son líneas de texto modificadas con
unas marcas. Estas marcas se llaman etiquetas o tags, y es lo que se aprende
en éste y cualquier curso de HTML.
Las etiquetas que encierran el texto son la de apertura <xxx> y la de cierre

</xxx>. Fíjate cómo no hay espacios entre los signos de mayor y menor, y el lugar
y la orientación de la barra diagonal en la etiqueta de cierre. Hay etiquetas que
requieren la de cierre (como <A> y </A>, otras que pueden tener etiqueta de cierre
o no (como , que no siempre requiere ) y otras que no llevan nunca
etiqueta de cierre (como <IMG>, la cual jamás lleva </IMG>). Para saber cuándo
se quiere etiqueta de cierre, necesitarás conocer todas y cada una de ellas, lo irás
aprendiendo con la experiencia.
ATRIBUTOS
Los atributos modifican las acciones de las tarjetas. Muchas etiquetas pueden
permanecer solas, mientras que otras neceistan un atributo para darles
funcionalidad. Por ejemplo, <HTML> nunca lleva atributos, mientras que <body>
puede llevarlos o no (por ejemplo, <body BGCOLOR...>).
Ten en cuenta que los atributos siempre van en la etiqueta de apertura. nunca en
la de cierre. Es absurdo poner algo del estilo de </body BGCOLOR...>.
VALORES
Definen el atributo al que se lo hemos aplicado. El valor puede ser una palabra
(por ejemplo ...) o un número de pixels o porcentaje
(como en <TABLE WIDTH="40%" HEIGHT="500">...</TABLE>). A veces un
número no define un número de pixels concreto, por ejemplo, al cambiar el tamaño
de las fuentes (...) el número es simplemente
orientativo, no tiene ninguna relación con el tamaño final. Y el número a veces
puede ser en formato hexadecimal (16 números, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C,
D, E, F...), como en .... Podrás conocer el
funcionamiento de estos números más adelante, cuando expliquemos los atributos
que los requieren.
ETIQUETAS DE LA ESTRUCTURA BÁSICA
Las etiquetas de la estructura básica. Como vimos en el tema 2, el documento

HTML se compone de unas etiquetas esenciales. Lo primero a escribir es
<HTML>, la etiqueta de inicio de los documentos HTML. Tras eso se introduce
<HEAD> para abrir la cabecera. A continuación hay que poner un título a la
página, el cual estará situado entre las etiquetas <TITLE> y </TITLE>. Tras eso
cerramos la cabecera con la etiqueta </HEAD>. Y lo que queremos que se vea en
pantalla irá entre <body> y </body>. Y por fin, cerramos con </HTML>. Hasta
ahora hemos escrito
Párrafos. Las etiquetas de párrafo nos servirán para iniciar un nuevo párrafo
de texto. No necesita la etiqueta al final si no están alineados de ninguna
manera.
Los párrafos pueden alinearse. En este caso sí que necesitan su correspondiente

etiqueta de cierre . Son las siguientes:
 Para alinear el texto con el margen izquierdo:
Este párrafo está alineado a la izquierda
 Para centrar el texto:
Este párrafo está centrado.
 Para alinear el texto con el margen derecho:
Este párrafo está alineado a la derecha
 Para alinear el texto a los dos márgenes. Es ignorado por
muchos navegadores, pero algunos no, como el Explorer 4.0.
Eso es un ejemplo el alineamiento justificado. Si se observa este breve párrafo

con exploradores como el Microsoft Internet Explorer 4.0 podrás observar que los
dos extremos, izquierdo y derecho, están alineados. Recuerda que para poder
apreciar este efecto en los párrafos de texto, necesitas escribir más de 2 líneas.
Si se quiere hacer un salto de línea o retorno de carro, habrá que usar la eiqueta
 . Por ejemplo:
Esto es un párrafo
Se vería así:
Esto
es un párrafo
Dos equivalen a un . Estos dos ejemplos se verían igual:
Esto es un párrafo
Esto es otro
Esto es un párrafo 
Esto es otro
También puede usarse la etiqueta .... Es para no permitir el

salto de línea, es decir, para hacer líneas muy largas en páginas en las que haya
que usar la barra de desplazamiento horizontal.
Alineación y espaciado
CABECERA
Son para poner títulos en nuestras páginas. Van entre las etiquetas <Hx> y </Hx>,
donde x en un número del 1 al 6. 1 es el número mayor y 6 el número menor. El
que corresponde al tamaño estándar del texto es 3. Estos números no tienen nada
que ver con el número de píxeles ni con los números de la etiqueta que
veremos posteriormente.
Usaremos la cabecera H1 o la H2 para el título principal de la página, y los otros

tamaños menores para los títulos inferiores de segunda categoría.
<H1>Prueba</H1> se verá como:
Prueba
Prueba

Prueba
Prueba
Prueba
Prueba
LÍNEAS HORIZONTALES
Líneas horizontales. En inglés horizontal rules. Para introducirlos hay que usar la
etiqueta <HR>. Así se creará una línea embutida en el fondo que llegue de lado a
lado de la página.
También se puede modificar. Para variar la anchura hay que usar el atributo
WIDTH=x%, donde x es el porcentaje del ancho de la pantalla. Para que ocupe el
75% habría que poner:
<HR WIDTH="75%">
Si se quiere variar la anchura en píxels hay que introducir el valor de ellos en

WIDTH=x, pero sin el símbolo %:
<HR WIDTH="250">
Se puede variar la alineación con el atributo ALIGN=x, donde x es LEFT o

RIGHT.
<HR WIDTH="50%" ALIGN="LEFT"> para alinear a la izquierda:

<HR WIDTH="50%" ALIGN="RIGHT"> para alinear a la derecha:
Se puede variar el espesor con SIZE=x, donde x es el número de píxels:
<HR SIZE="15">
Y por último se puede hacer que la línea no esté sombreada con el atributo
NOSHADE:
<HR NOSHADE>
FORMATEO DEL TEXTO
Formateo del texto. Veremos una serie de etiquetas para el texto:
Líneas en blanco, con .
 
 
 
 
quedaría así:
Espacios. Nos pueden servir para separar imágenes de textos. La etiqueta es

Negrita, cursiva, subrayado y tachado. Necesitan etiqueta de cierre. Son

negrita para negrita, cursiva para cursiva,
subrayado para subrayado y <S>tachado</S> para tachado. Es
posible usarlos a la vez, <S>texto</S> para texto.
Hay otras etiquetas que equivalen a estas, como = ; <CITE> y
 = ; y <STRIKE> = <S>.
Aumentar o disminuir tamaño del texto. Se puede hacer de una forma muy
sencilla con <BIG>...</BIG> para aumentarlo y con ... para
disminutirlo. Por ejemplo:
Este es un texto <BIG>más grande</BIG>
Se vería como
Este es un texto más grande
Este es un texto más pequeño
Se vería como
Este es un texto más pequeño
En vez de usar estas dos etiquetas, puedes usar la etiqueta que se
explica más abajo.
Preformateado. La etiqueta es <PRE> con etiqueta de cierre. La característica
es que se verá con letra Courier respetando espacios y cambios de lía, por
ejemplo:
<PRE>
Hola
Esto es una prueba del preformateado
</PRE>
y quedaría así:
Hola

Máquina de escribir. La etiqueta es <TT> con etiqueta de cierre. Es como el
anterior pero sólo cambia el tipo de letra, por ejemplo (el mismo que pusimos en
PRE):
<TT>
Hola
</TT>
y quedaría así:
Hola Esto es una prueba del preformateado
Como ves no ha respetado los espacios ni los cambios de línea.

Citas textuales. La etiqueta es <BLOCKQUOTE> con etiqueta de cierre, para
resaltar partes de texto con márgenes a ambos lados, por ejemplo:
<BLOCKQUOTE>
xxxxxxxxxxxxxxxxx xxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx

xxxxxxxxxxxxxxxx xxxx xxxxxxxxxxx xxxxxxxxxxxx xxxxxxxxx
xxxxxxxxxxxxxxx xxxxx xxxxxxxxxxxx
</BLOCKQUOTE>
y quedaría así:
xxxxxxxxxxxxxxxxx xxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxxxxxxx

xxxx xxxxxxxxxxx xxxxxxxxxxxx xxxxxxxxx xxxxxxxxxxxxxxx xxxxx xxxxxxxxxxxx
Texto parpadeante. Sólo lo incorpora Netscape Navigator. La etiqueta es

<BLINK> y <BLINK>, y quedaría así:
<BLINK>Hola</BLINK>
Hola
Índices y subíndices. Las etiquetas son para el superíndice y 
para el subíndice (ambas con etiqueta de cierre), por ejemplo:
cm3
cm3
H2SO4
H2SO4
Etiqueta FONT. Tiene etiqueta de cierre, y nos permite variar el tamaño, el
color, y el tipo de letra de un texto determinado. Utiliza para ello los atributos
siguientes:
size="x", siendo "x" el número del tamaño, de 1 a 8, por defecto 3; o +/-, que
indican si se usa un tamaño inferior o superior), bgcolor="xxyyzz" (siendo
"xxyyzz" un número hexadecimal). Para saber qué es esto mira el tema de
fondos) y face="xxx" (siendo "xxx" el nombre de la fuente). Si la fuente tiene
dos palabras o más es necesario poner comillas, y se pueden colocar varios
nombres para usar unas fuentes en caso que otras no existan. Si la fuente no
está instalada en el ordenador se verá Times New Roman). Ejemplo:
Prueba de

texto.
...que quedaría así:
Prueba de texto
Observa cómo hay dos nombres de fuentes. En caso de que Arial no esté
instalada se verá con Verdana, y si ésta tampoco lo está se verá entonces con
Times New Roman: la fuente por defecto.
LISTAS
Hay tres clases de listas: desordenadas, ordenadas y de definición:
Listas desordenadas. Las etiqueta es <UL> con etiqueta de cierre para la lista
y <LI> para cada línea. Puede contener el atributo type que indica la forma del
"topo" o marca que antecede a cada elemento de la lista. Los valores de type
pueden ser disk, circle o square, con lo que el topo o marca puede ser un
disco, un circulo o un cuadrado.
Un ejemplo:
<UL type=square>
<LI>Elemento 1
<LI>Elemento 2
<LI>Elemento 3
</UL>
Elemento 1
Elemento 2
Elemento 3
Es posible anidar las listas, por ejemplo:
<UL>
<LI>Elemento 1
<UL>
<LI>Elemento 1.1
<LI>Elemento 1.2
<LI>Elemento 1.3
</UL>
<LI>Elemento 2
<LI>Elemento 3
</UL>
Elemento 1
Elemento 1.1
Elemento 1.2
Elemento 1.3
Elemento 2
Elemento 3
En otro tema veremos cómo poner una imagen en vez de el punto, cuadrado o
disco.
También podemos cambiar el tipo de símbolo elemento por elemento:
<UL>
<LI type=square>Elemento 1
<LI type=circle>Elemento 2
<LI type=disk>Elemento 3
</UL>
Elemento 1
Elemento 2
Elemento 3
Listas ordenadas o numeradas. Las etiqueta es <OL> con etiqueta de cierre
para la lista y <LI> para cada línea. Puede llevar los siguientes atributos:
start = num Indica que número será el primero de la lista. Si no se indica se

entiende que empezará por el número 1.
type = tipo Indica el tipo de numeración utilizada. Si no se indica se entiende
que será una lista ordenada numéricamente.
Los tipos posibles son : 1 = Numéricamente. (1,2,3,4,... etc.) a = Letras

minúsculas. (a,b,c,d,... etc.) A = Letras mayúsculas. (A,B,C,D,... etc.) i =
Números romanos en minúsculas. (i.ii,iii,iv,v,... etc.) I = Números romanos en
mayúsculas. (I,II,III,IV,V,... etc.)
Un ejemplo:
<OL type=i>
<LI>Elemento 1
<LI>Elemento 2
<LI>Elemento 3
</OL>
i. Elemento 1
ii. Elemento 2
iii. Elemento 3
Estas listas también pueden anidarse, al igual que las listas desordnedadas.
A cada elemento puede dársele un valor similar a start=x, con value=x:
<OL>
<LI value=10>Este elemento vale 10
<LI>Elemento siguiente
<LI>Otro elemento más
</OL>
10. Este elemento vale 10

11. Elemento siguiente
12. Otro elemento más
Listas de definición. La etiqueta es <DL> con etiqueta de cierre para la lista,

<DT> para cada palabra y <DD> para cada definición de cada palabra, por
ejemplo:
<DL>
<DT>Elemento 1
<DD>Definición de elemento 1
<DT>Elemento 2
<DT>Elemento 3
</DL>
Elemento 1
Definición de elemento 1
Elemento 2
Elemento 3
Existen otros dos tipos de listas menos comunes. Las listas de Menú o Directorio
se comportan igual que las listas sin numerar. La lista de Menú utiliza la etiqueta
<MENU></MENU> y los elementos se anteceden de <LI> El resultado es una lista
sin numerar más "compacta" es decir, con menos espacio interlineal entre los
elementos. La lista de Directorio utiliza la etiqueta <DIR></DIR> y los elementos
se anteceden de <LI>. Los elementos tienen un límite de 20 caracteres.
Elementos de modificación de fuentes: FONT y BASEFONT
FONT y BASEFONT están desaprobados.
Véase el DTD Transicional para la definición formal.
Definiciones de atributos
size = cdata [CN]
Desaprobado. Este atributo especifica el tamaño de la fuente. Valores

posibles:
Un entero entre 1 y 7. Esto establece la fuente en algún tamaño fijo,

cuya representación depende del agente de usuario. No todos los
agentes de usuario pueden representar los siete tamaños.
Un incremento relativo del tamaño de la fuente. El valor "+1" significa
un tamaño más grande. El valor "-3" significa tres tamaños menor.
Todos los tamaños pertenecen a la escala de 1 a 7.
color = color [CI]

Desaprobado. Este atributo especifica el color del texto.
face = cdata [CI]
Desaprobado. Este atributo define una lista de nombres de fuentes

separados por comas que el agente de usuario debería buscar en orden de
preferencia.
Atributos definidos en otros lugares
id, class (identificadores a nivel de documento)

lang (información sobre el idioma), dir (dirección del texto)
title (título del elemento)
style (información de estilo en línea)
El elemento FONT cambia el tamaño y color de la fuente para el texto de sus

contenidos.
El elemento BASEFONT establece el tamaño base de fuente (usando el atributo

size). Los cambios del tamaño de la fuente producidos con FONT son relativos al
tamaño base de fuente establecido por BASEFONT. Si no se usa BASEFONT, el
tamaño base de fuente es 3.
EJEMPLO DESAPROBADO:
El siguiente ejemplo mostrará la diferencia entre los siete tamaños de fuente
disponibles con FONT:
size=1
size=2
Esto podría representarse así:
A continuación mostramos un ejemplo del efecto de los tamaños de fuente

relativos usando un tamaño base de fuente 3:
El tamaño base de fuente no se aplica a los encabezados, excepto cuando éstos

sean modificados por medio del elemento FONT con cambios de tamaño de
fuente relativos.
15.3 Separadores: el elemento HR

<!ELEMENT HR - O EMPTY -- separador horizontal -->
<!ATTLIST HR
%attrs; -- %coreattrs, %i18n, %events --
>
Etiqueta inicial: obligatoria, Etiqueta final: prohibida
Definiciones de atributos
align = left|center|right [CI]
Desaprobado. Este atributo especifica la alineación horizontal del

separador con respecto al contexto circundante. Valores posibles:
left: el separador se representa alineado a la izquierda.

center: el separador se representa centrado.
right: el separador se representa alineado a la derecha.
El valor por defecto es align=center.
noshade [CI]
Desaprobado. Si se establece, este atributo booleano pide al agente de

usuario que represente el separador con un color sólido en lugar del
"relieve" tradicional de dos colores.
size = píxeles [CI]
Desaprobado. Este atributo especifica la altura del separador. El valor por

defecto de este atributo depende del agente de usuario.
width = longitud [CI]
Desaprobado. Este atributo especifica la anchura del separador. El valor

por defecto es del 100%, es decir, el separador se extiende por todo el
ancho del lienzo.
Atributos definidos en otros lugares
id, class (identificadores a nivel de documento)

lang (información sobre el idioma), dir (dirección del texto)
title (título del elemento)
style (información de estilo en línea)
onclick, ondblclick, onmousedown, onmouseup, onmouseover,
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup (eventos
intrínsecos)
El elemento HR hace que el agente de usuario represente una línea separadora

horizontal.
La cantidad de espacio vertical insertado entre el separador y el contenido que le
rodea depende del agente de usario.
EJEMPLO DESAPROBADO:
Este ejemplo centra los separadores, dándoles un tamaño igual a la mitad de la
anchura disponible entre márgenes. El separador superior tiene el tamaño por
defecto, mientras que los dos inferiores son de 5 píxeles. El separador inferior
debería representarse con un color sólido sin efecto de relieve:
<HR width="50%" align="center">

<HR size="5" width="50%" align="center">
<HR noshade size="5" width="50%" align="center">

Fundamentos de html2

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Fundamentos de html2

Uploaded by

Copyright:

Available Formats

Índice

HTML: siglas de HyperText Markup Language (Lenguaje de Marcas de

Una página web, también conocida como página de Internet, es un documento

El contenido de la página puede ser predeterminado ("página web estática") o

Respecto a la estructura de las páginas web algunos organismos, en especial el

Tabla de colores en html

En HTML, los colores se definen mediante tres números hexadecimales que

Funciones HTML básicos

<html>: define el inicio del documento HTML, le indica al navegador

<script>: incrusta un script en una web, o se llama a uno mediante

<head>: define la cabecera del documento HTML, esta cabecera

Un ejemplo de código HTML con coloreado de sintaxis

<title>: define el título de la página. Por lo general, el título aparece

<link>: para vincular el sitio a hojas de estilo o iconos Por

<style>: para colocar el estilo interno de la página; ya sea usando

<meta>: para metadatos como la autoría o la licencia, incluso para

<body>: define el contenido principal o cuerpo del documento. Esta

<h1> a <h6>: encabezados o títulos del documento con diferente

<table>: define una tabla

<tr>: fila de una tabla

<td>: columna de de una tabla

<a>: Hipervínculo o enlace, dentro o fuera del sitio web. Debe

<div>: división de la página. Se recomienda, junto con css, en vez de

<li><ol><ul>: Etiquetas para listas.

<b>: texto en negrita (Etiqueta desaprobada. Se recomienda usar la

<i>: texto en cursiva (Etiqueta desaprobada. Se recomienda usar la

<s>: texto tachado (Etiqueta desaprobada. Se recomienda usar la

<u>: texto subrayado

<table><tr><td>Contenido de una celda</td></tr></table>

<script>Código de un [[script]] integrado en la página</script>.

Los componentes del HTML

El propósito de este capítulo es introducir a los tres componentes fundamentales

El pilar central de todo HTML es la etiqueta (técnicamente se refiere como un

EN CONSTRUCCIÓN DESDE AQUÍ

Las etiquetas que encierran el texto son la de apertura <xxx> y la de cierre

ETIQUETAS DE LA ESTRUCTURA BÁSICA

Las etiquetas de la estructura básica. Como vimos en el tema 2, el documento

Los párrafos pueden alinearse. En este caso sí que necesitan su correspondiente

<P ALIGN="LEFT"> Para alinear el texto con el margen izquierdo:

Este párrafo está alineado a la izquierda

<P ALIGN="CENTER"> Para centrar el texto:

Este párrafo está centrado.

<P ALIGN="RIGHT"> Para alinear el texto con el margen derecho:

Este párrafo está alineado a la derecha

Eso es un ejemplo el alineamiento justificado. Si se observa este breve párrafo

Dos <BR> equivalen a un <P>. Estos dos ejemplos se verían igual:

También puede usarse la etiqueta <NOBR>...</NOBR>. Es para no permitir el

Usaremos la cabecera H1 o la H2 para el título principal de la página, y los otros

<H1>Prueba</H1> se verá como:

<H2>Prueba</H2> se verá como:

<H3>Prueba</H3> se verá como:

<H4>Prueba</H4> se verá como:

<H5>Prueba</H5> se verá como:

<H6>Prueba</H6> se verá como:

Si se quiere variar la anchura en píxels hay que introducir el valor de ellos en

Se puede variar la alineación con el atributo ALIGN=x, donde x es LEFT o

<HR WIDTH="50%" ALIGN="LEFT"> para alinear a la izquierda:

Se puede variar el espesor con SIZE=x, donde x es el número de píxels:

FORMATEO DEL TEXTO

Formateo del texto. Veremos una serie de etiquetas para el texto:

Líneas en blanco, con <BR><P>.

Espacios. Nos pueden servir para separar imágenes de textos. La etiqueta es

Negrita, cursiva, subrayado y tachado. Necesitan etiqueta de cierre. Son

Este es un texto <BIG>más grande</BIG>