Programación Web
M.S.C. Norma Leticia Hernández Chaparro
HTML, XML y CSS
2.1 Introducción.
2.2 Estructura global de un documento Web.
2.3 Elementos básicos: texto, vínculos, listas, tablas, objetos,
imágenes y aplicaciones.
2.4 Formularios
2.5 Lenguajes de presentación en documentos
Web.
2.6 Selectores.
2.7 Modelo de caja.
Introducción
HTML es el lenguaje con el que se escriben las páginas
web. Las páginas web pueden ser
vistas por el usuario mediante un tipo de aplicación
llamada navegador. Podemos decir por lo
tanto que el HTML es el lenguaje usado por los
navegadores para mostrar las páginas webs al
usuario, siendo hoy en día la interface más extendida en
la red.
Este lenguaje nos permite aglutinar textos, sonidos e
imágenes y combinarlos a nuestro gusto.
Además, y es aquí donde reside su ventaja con respecto a
libros o revistas, el HTML nos permite
la introducción de referencias a otras páginas por medio
de los enlaces hipertexto.
2.2 Estructura global de un
documento Web.
La estructura de un documento Web se divide en 3 zonas
principales:
Cabecera
Titulo
Cuerpo
Head: hojas de estilo, java
script, Tipografias, cuestiones
técnicas para el navegador
Body: Texto, imágenes,
estructura, fomularios,
animaciones, etc,
2.3 Elementos básicos:
texto,
vínculos,
listas,
tablas,
objetos,
imágenes
aplicaciones.
Uso de etiquetas
<html> </html> Inicio y fin de nuestro documento
<head> </head> Encabezado va después de la etiqueta
html para cuestiones técnicas del documento
<body> </body> va después del head, aquí va todo lo
que queremos visualizar en nuestra página
Uso de etiquetas
<p> </p> sirve para colocar un párrafo
<b> </b> pone en negritas el texto entre las etiquetas
<br> no tiene etiqueta de cierre, sirve para dar salto de línea
<p align="left"> </p> alinear texto a la izquierda
<p align=“center"> </p> alinear texto a al centro
<p align="right"> </p> alinear texto a la derecha
Uso de etiquetas: div
<div align="left">
<p>Parrafo1</p> Al ocupar el div, ayuda a
concentrar un contenido y
<p>Parrafo2</p> alinearlo todo a la izquierda por
ejemplo
<p>Parrafo3</p>
</div>
Uso de etiquetas encabezados
El tamaño de encabezado va de 1 a 6 <h1> al <h6>
<h1>Encabezado de nivel 1</h1> NIVEL 1
<h2 align="center">Encabezado de nivel 2</h2>
<i>Texto en itálica</i> formato de texto en itálica
<u> y </u> texto subrayado
Subíndices y supraíndices
<sup> y </sup> para los supraíndices
<sub> y </sub> para los subíndices
La<sup>13</sup>CC<sub>3</sub>H<sub>4</
sub>ClNOS es un heterociclo alérgeno enriquecido
Color, tamaño y tipo de
letra
<font face="Comic Sans MS,arial,verdana">Este texto
tiene otra tipografía</font>
<font size=4>Este texto es más grande</font>
<font color="red">Este texto está en rojo</font>
