Scribd
Cargar
2 vistas17 páginas

HTML

HTML (Hyper Text Markup Language) es el lenguaje utilizado para crear páginas web, compuesto por etiquetas que delimitan los elementos del documento. La estructura básica de una página HTML incluye las etiquetas <HTML>, <head> y <body>, y los documentos deben tener la extensión .html o .htm. Los atributos de las etiquetas permiten personalizar su funcionamiento y se configuran en el momento de generarlas.

Cargado por

Aldo
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
2 vistas17 páginas

HTML

HTML (Hyper Text Markup Language) es el lenguaje utilizado para crear páginas web, compuesto por etiquetas que delimitan los elementos del documento. La estructura básica de una página HTML incluye las etiquetas <HTML>, <head> y <body>, y los documentos deben tener la extensión .html o .htm. Los atributos de las etiquetas permiten personalizar su funcionamiento y se configuran en el momento de generarlas.

Cargado por

Aldo
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 17

Diseño de páginas Web

a través del código


¿Qué es HTML?

 HTML (Hyper Text Markup Language) es el lenguaje con el que se


escriben las páginas web. Es un lenguaje de hipertexto, es decir, un
lenguaje que permite escribir texto de forma estructurada, y que
está compuesto por etiquetas, que marcan el inicio y el fin de
cada elemento del documento.

 Los documentos HTML deben tener la extensión html o htm, para


que puedan ser visualizados en los navegadores.
Editores
 Un editor de texto es un programa que nos permiten redactar
documentos.
 Para crear páginas web escribiendo directamente el código
HTML puedes utilizar el Bloc de notas que proporciona
Windows.
 Al final debes guardar el archivo asignándole un nombre y
modificando la extensión a .html por ejemplo: Ejercicio 1.html
Etiquetas (tags)

Las etiquetas o marcas delimitan cada uno de los elementos que


componen un documento HTML. Es una cadena formada por los símbolos
de menor que < y mayor que > y entre ellos una cadena que determina el
nombre de la etiqueta.
Existen dos tipos de etiquetas:
Etiquetas
 Etiqueta Simple
Existen etiquetas simples las cuales se componen solo de la parte de inicio.
Por ejemplo: <br>

 Etiqueta doble
La etiqueta de comienzo está delimitada por los caracteres < > y está
compuesta por el nombre de la etiqueta, además puede contener una serie
de atributos opcionales que permiten añadir ciertas propiedades.
La etiqueta de final está delimitada por los caracteres </ > y no contiene
atributos.
Por ejemplo <P> Aquí va un texto </P>
Estructura básica de una página
Estas etiquetas
NO pueden faltar
 La estructura básica de una página es: en el código
HTML

<HTML>
<head>
<title>
</title>
</head>
<body>
...
</body>
</HTML>
Etiqueta <HTML>
Todas las páginas web escritas en HTML deben tener la
extensión .html o .htm
Así mismo, deben tener las etiquetas <HTML> y </HTML>

HTML

Es la etiqueta más
importante

Permite identificar el
código de una
página web

Se coloca al principio
y al final del
documento
Cabecera de la página <head>
 Esta etiqueta se utiliza para agrupar información sobre ella, como
puede ser el título. Es de tipo doble y está formada por las
etiquetas <head> y </head>. Va justo debajo de la
etiqueta <HTML>. Contiene Información técnica para el navegador.
Título de la página <title> … </title>
 El título de la página es el que aparecerá en la parte superior de la
ventana del navegador, cuando la página esté cargada en él.
 Para asignar un título a una página es necesario escribir el texto
deseado entre las etiquetas <title> y </title>.
Por ejemplo:
Cuerpo del documento <body>

 El cuerpo del documento contiene la información propia del


documento, es decir lo que queremos que se visualice, como puede ser:
el texto de la página, las imágenes, los formularios, multimedios, etc.
Todos estos elementos tienen que encontrarse entre las
etiquetas <body> y </body>, que van justo debajo de la cabecera.
Atributos
Las etiquetas contienen una serie de parámetros para poder
personalizar la operación que realizan. Estos parámetros se llaman
Atributos de la etiqueta y se configuran en el momento de generar una
etiqueta.

Reglas de los atributos


1. El atributo se genera del par nombre = Valor

2. El valor del atributo siempre se escribe entre comillas “ ”.


3. Los atributos son denotados dentro de la etiqueta de inicio.
4. Los atributos se separan entre ellos a través de espacios en blanco.
Ejemplo de etiqueta con atributo:

 El atributo align, significa alineación y le indica al navegador la


alineación del párrafo (derecha, izquierda, centrado o justificado). El
valor del atributo align puede ser uno de los siguientes:
right, left, center o justify.

Etiqueta
Etiqueta de apertura
de cierre

Texto contenido
Atributo Valor dentro de las etiquetas

Prof. Leydi del Carmen López Ibañez


Atributos para el cuerpo <BODY>

 bgcolor="#0000FF“ o bien bgcolor="blue“ (Color de fondo para


la página)

 background="fondo.gif“ (imagen de fondo de una página,


ubicada en el mismo directorio).

 background="imagenes/fondo.gif“ (imagen de fondo de una


página, ubicada en una carpeta en el mismo directorio)

 text="#FF0000“ (establecer el color del texto de la página)


Ejemplo
Por ejemplo, para hacer que el color de fondo de una página sea de un
color en especial, tendremos que escribir el atributo bgcolor dentro de la
etiqueta body, por ejemplo:
Ejemplo: Página con texto y color de fondo
Abre el bloc de
notas y escribe el
siguiente código

Guarda este archivo en el escritorio o


documentos con el nombre de:
Ejemplo1.html
Ejemplo Una vez que guardaste tu archivo,
dirígete al escritorio y busca el archivo
guardado. Probablemente tu archivo
aparece con el icono del navegador de
internet, tal y como se muestra en el
ejemplo, para abrir la página solo da
doble clic.

Tu página
quedará
como en la
siguiente
imagen
Ejemplo:
Si el archivo aparece como en esta imagen,
para poder abrirlo da clic derecho sobre el
icono, elige abrir con y te aparecerá la opción
de internet Explorer o Chrome y elige una
opción de navegador.

También podría gustarte