Trabajos: Código HTML

INFORMÁTICA

KLASSE 9

CÓDIGO HTML

MARCAS BÁSICAS

<html></html> Al principio y al final de todo documento.

<head> </head> Cabecera del documento. Dentro del head se ponen las

etiquetas:

<title> </title> indica el título de la página para el navegador.

Tras cerrar el head el se pone la etiqueta:

<body> </body> Dentro de esta etiqueta se insertan los contenidos del documento

El cierre de la etiqueta </body> se coloca justo antes del cierre </html>

PROPIEDADES DE LA PÁGINA

La etiqueta <body> puede llevar incluida información sobre las propiedades de la

página:

<body bgcolor="#xxyyzz"> define el color de fondo de la página.

<body text="#xxyyzz"> define el color por defecto del texto en la página.

<body link="#xxyyzz"> define el color de los enlaces.

<body vlink="#xxyyzz"> define el color de los enlaces visitados.

<body alink="#xxyyzz"> define el color de los enlaces activos.

<body background="imagen.gif"> establece una imagen para el fondo de la

página.

Todos estos parámetros se pueden agrupar en una única etiqueta <body>:

<body bgcolor="#xxyyzz" text="#xxyyzz" link="#xxyyzz" vlink="#xxyyzz"

alink="#xxyyzz">

Sirve para anotar aclaraciones 'privadas' del autor de la

página. Lo que se escribe dentro de esta etiqueta es ignorado por el navegador y

no se muestra en la página.

FORMATO DE TEXTOS

negrita (también sirve la etiqueta … )

cursiva (también sirve la etiqueta …)

subrayado

…… marca el tamaño de los caracteres, donde X es un

valor del 1 a 7, o un valor relativo (+ 1-7).

…… define el color del texto, donde XXYYZZ es

un valor formado por letras y números que indica el color.

…… determina el tipo de la fuente.

La etiqueta puede incluir los tres parámetros (tamaño, fuente y color):

……

<pre> preformateado. Respeta espacios, saltos de línea y los retornos utilizados.

<blink> hace parpadear el texto (no para Explorer)

Tecnología de la información

http://www.unav.es/dpp/tecnologia/

FORMATO DE PÁRRAFOS

salto de párrafo

salto de línea

<blockquote> </blockquote> sangrado.

<center> centrar el texto.

párrafo centrado.

párrafo alineado a la izquierda.

párrafo alineado a la derecha.

LÍNEAS HORIZONTALES SEPARADORAS

<hr> línea horizontal.

<hr width="x%"> anchura de la línea en porcentaje.

<hr width=x> anchura de la línea en píxeles.

<hr size=x> altura de la línea en píxeles.

<hr align=center> línea alineada en el centro.

<hr align=left> línea alineada a la izquierda.

<hr align=right> línea alineada a la derecha.

<hr noshade> línea sin efecto de sombra.

IMÁGENES

<img src="dirección de la imagen” "> indica la ruta de la imagen.

<img ... border=”X"> establece un borde de X pixels en torno a la imagen.

<img ... height="XX" width="YY"> establece un tamaño de la imagen (altura y

anchura) en pixels.

<img ... alt="texto explicativo"> se muestra un texto al pasar el cursorsobre la

imagen.

<img ... align="bottom"> alineación inferior del texto respecto de la imagen.

<img ... align="middle"> alineación del texto en el medio de la imagen.

<img ... align="top"> alineación superior del texto respecto de la imagen.

<img ... align="left"> alineación izquierda de la imagen en el párrafo.

<img ... align="right"> alineación derecha de la imagen en el párrafo.

<img ... hspace=X> espacio horizontal entre la imagen y el texto.

<img ... vspace=y> espacio vertical entre la imagen y el texto.

TABLAS




Útiles para componer la página y para presentar datos tabulares.
<table>……</table> Define dónde comienza y termina la tabla
<table width="XX%"> Determina la anchura de la tabla. Puede darse en píxeles
(no lleva el símbolo %), o en porcentaje de la página.
<table height="XX> Determina la altura de la tabla en píxeles.
<table border="X"> Establece el grosor en píxeles del borde de la tabla
<table cellspacing="X"> Define el espacio en píxeles entre las celdas
<table cellpadding="X"> Define el espacio en píxeles entre el borde y el texto
<tr>……<tr> determina cada una de las filas de la tabla
<td>……</td> determina cada una de las columnas dentro de las filas
Ejemplo de tabla de 2 filas y 3 columnas
<table width="100%" height="200" border="1" cellspacing="3" cellpadding="5">
<tr>
<td>primera columna de la fila 1</td>
<td>segunda columna de la fila 1</td>
<td>tercera columna de la fila 1</td>
</tr>
<tr>
<td>primera columna de la fila 2</td>
<td>segunda columna de la fila 2</td>
<td>tercera columna de la fila 2</td>
</tr>
</table>
<td rowspan="2">&nbsp;</td> une dos celdas de dos filas adyacentes, en una
única celda.
<td colspan="2">&nbsp;</td> une dos celdas de dos columnas adyacentes en una
sola celda.
Dentro de cada celda se puede alinear el texto o cualquier contenido, cambiar el
color de fondo, con las etiquetas habituales para texto, párrafos o imágenes.




CREACIÓN DE ENLACES




<a href=”http://www.servidor.com/directorio/pagina.htm”>Enunciado del
enlace</a>
<a href=”mailto:dirección de mail”> Vínculo a una dirección de correo-e.
<a name=”marcador”> define un marcador (ancla) en un punto concreto de una
página, para poder enlazarlo posteriormente.
<a href=”#marcador”> dirige un enlace interno al punto dónde está el marcador.
<a href=”dirección página#marcador”> dirige el enlace a un punto concreto de otra
página.
Dentro del a href:
target="_blank" Abre la página en un nuevo navegador.
target=”_top” Abre la página en toda la pantalla para evitar los frames.
title=”texto descriptivo del enlace” permite incluir una descripción del destino del
enlace




Colores en HTML

http://usuarios.sion.com/pauluk/coloreshtml.htm

Trabajos

Código HTML

No hay comentarios:

Publicar un comentario

Seguidores

Vistas de página en total

Datos personales

Archivo del blog