Professional Documents
Culture Documents
Estructura
Presentación
Hipertexto
Etiquetas
La estructura básica de un documento HTML
incluye etiquetas, que rodean el contenido y
le aplican formato.
<h2>¿Qué es esto?</h2>
<p>Una página simple creada usando
HTML</p>
<h2>¿Qué es esto?</h2>
<p>Una página simple creada usando HTML</p>
<ul>
<li>Para aprender HTML</li>
<li>
Para presumir
<ol>
<li>A mi maestra</li>
<li>A mis amigos</li>
<li>A mi gato</li>
<li>Al pequeño pato hablador en mi cerebro</li>
</ol>
</li>
<li>Porque me he enamorado de mi computadora y quiero darle amor
HTML.</li>
</ul>
Enlaces (Links)
Una etiqueta ancla (a) es usada para definir
un enlace pero también necesitarás el destino
(href)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN”
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Mi primera página web</title>
</head>
<body>
<h1>Mi primera página web</h1>
<h2>¿Qué es esto?</h2>
<p>Una página simple creada usando HTML</p>
<h2>Enlace recomendado</h2>
<p><a href=“http://rocktech.blogspot.com/”>Rock &
Tech</a></p>
</body>
</html>
Imágenes
La etiqueta img es usada para insertar una
imagen en un documento HTML. Agrega lo
siguiente antes de /body:
<img src=" http://www.google.com/images/logo.gif " width="157" height="70"
alt=“Google Logo" />
2</td>
<td>Fila 1, celda
tr define una fila
<td>Fila 1, celda
3</td>
</tr>
td define una celda
<tr>
<td>Fila 2, celda
(deben estar entre
1</td>
<td>Fila 2, celda etiquetas tr)
2</td>
<td>Fila 2, celda
3</td>
</tr>
<tr>
<td>Fila 3, celda
1</td>
<td>Fila 3, celda
2</td>
<td>Fila 3, celda
3</td>
Insertando HTML externo
Es tan fácil como copiar y pegar el código que
se nos proporciona.
Si se requiere se le puede dar formato
después.
Intenta pegando este código:
<object width="425" height="350"><param name="movie"
value="http://www.youtube.com/v/a1Y73sPHKxw"></param><para
m name="wmode" value="transparent"></param><embed
src="http://www.youtube.com/v/a1Y73sPHKxw" type="application/x-
shockwave-flash" wmode="transparent" width="425"
height="350"></embed></object>
Juntándolo todo
Consulta el archivo “Juntándolo todo.html”
para un ejemplo de todo lo que hemos visto
junto.
No te limites, experimenta y juega con
valores y etiquetas. Lo más que puede pasar
es que no se muestre bien.
Intenta ver el código fuente de las páginas
que visitas frecuentemente. (clic derecho > ver código
fuente)
Si has podido con todos los pasos y has
comprendido cómo funciona, ya eres un
HTMLero competente ;-)
Si te interesa puedes aprender más en