< TABLE BORDER ="2" > escribir los datos de filas entre las celdas entre los comandos < TR > y < /TR > y los datos de cada celda entre < td > y< /td >... al final cerrar tabla con < /TABLE >Y quedará así:
viernes, 6 de diciembre de 2013
Tablas y Listas
Para poner Tablas de contenidos habrá que activar el contenido general dando grosor de borde (si se desea) con el comando siguiente, pongamos como ejemplo el valor 1 de tamaño de borde:
Enlaces
Un enlace se diferencia en el texto normal ya que al colocar el cursor encima cambio de forma y pasa de flecha a mano. Los enlaces aparerceran subrayados ya que esta opcion por defecto que les asigna el html.
En HTML el enlace se identifica con la etiqueta <a></a>. la forma es la siguiente:
<a href="archivo_enlazado">contenido del enlace</a>.
El atributo href puede ser una direccion absoluta o relativa.
Se puede añadir a los enlaces el atributo title.
En HTML el enlace se identifica con la etiqueta <a></a>. la forma es la siguiente:
<a href="archivo_enlazado">contenido del enlace</a>.
El atributo href puede ser una direccion absoluta o relativa.
Se puede añadir a los enlaces el atributo title.
EJERCICIO
- Escribe en el buscador de google "http".
- Selecciona una imagen similar a la que aparece en la izquierda.
- Guardala como webmaster.jpg en la misma carpeta donde está el archivo "ejercicio3.htm"
- Insértala en el ejercicio. Debes añadir la linea resaltada en negrita.
- Guardalo como "ejercicio4.htm"
- Comprueba el resultado.
Y quedara asi:
Etiqueta de imagen
Para introducir una imagen, lo hacemos con la etiqueta:
<img/>.
<img src="ubicacion/imagen.gif" alt="texto alternativo" />
Debemos saber donde esta la imagen, que es lo que debe contener el atributo src: Si está en una página web basta con saber su ruta, por ejemplo http://www.educarm.es/logo_ac1.jpg
Si esta en el mismo sitio que la página web se pone una dirección relativa, como imagen.gif o imagenes/imagen.gif.
Cuando el navegador no encuentra imagen no la podrá mostrar.
El atributo alt se muestra cuando no se puede mostrar la imagen.
Los atributos height y width. Se suelen añadir introduciendo las dimensiones de la imagenes en pixeles.
Atributo title. Si lo ponemos , al posar el cursor sobre ella se mostrará su valor. En IE7, cuando se omite title, se muestra el contenido de alt.
<img/>.
<img src="ubicacion/imagen.gif" alt="texto alternativo" />
Debemos saber donde esta la imagen, que es lo que debe contener el atributo src: Si está en una página web basta con saber su ruta, por ejemplo http://www.educarm.es/logo_ac1.jpg
Si esta en el mismo sitio que la página web se pone una dirección relativa, como imagen.gif o imagenes/imagen.gif.
Cuando el navegador no encuentra imagen no la podrá mostrar.
El atributo alt se muestra cuando no se puede mostrar la imagen.
Los atributos height y width. Se suelen añadir introduciendo las dimensiones de la imagenes en pixeles.
Atributo title. Si lo ponemos , al posar el cursor sobre ella se mostrará su valor. En IE7, cuando se omite title, se muestra el contenido de alt.
Imágenes
En una página web se utilizan imágenes, para mostrar información y como parte del propio diseño de la página. En páginas web existen tres tipos de imágenes: GIF, PNG y JPG
Utilizaremos GIF y PNG para dibujos sencillos, gráficos etc..
Y JPG para imágenes con calidad.
Utilizaremos GIF y PNG para dibujos sencillos, gráficos etc..
Y JPG para imágenes con calidad.
Para aumentar o disminuir una imágen utilizamos un programa gráfico para optimizar las imagenes.
Foto original.
Gif+de+gifs-infantiles.jpg)
Jpg+de+gifs-infantiles.png)
PngEJERCICIO COMPLEMENTARIO:
1º Abre el bloc de notas, y guardalo con el nombre que quieras.
2º Dentro del Documento, crea etiquetas que forman la estructura de la página
3. <html>
4. <head>
5. </head>
6. <body>
7. </body>
<head>
8º Dentro del <head>, añade el titulo de página con la etiqueta <title>
Dentro del body, añade el siguiente encabezado 1: <h1>Página de ejemplo</h1>
9º A conrinuación, añade el siguiente encabezado 2: <h2>Texto normal</h2>.
10º Añade el siguiente párrafo: <p>El ñandú común es un ave sudamericana muy parecida al avestruz.</p>
11º Añade el siguiente párrafo: <p>Este ave, es omnivora y no puede volar, aunque es una gran corredora.</p>
12º Añade el siguiente párrafo con saltos: <p>Otras aves emparentadas con el ñandú son: <br/> - El avestruz<br/> - El amú<br/> -El kiwi.</p>
13º Añade el siguiente encabezado 2: <h3>Caracteres especiales</h3>.
14º Añade el siguiente párrafo: <p>El ñ andú comú n es un ave sudamericana muy parecida al avestruz.</p>.
15º Guarda la página y pruebala.
2º Dentro del Documento, crea etiquetas que forman la estructura de la página
3. <html>
4. <head>
5. </head>
6. <body>
7. </body>
<head>
8º Dentro del <head>, añade el titulo de página con la etiqueta <title>
Dentro del body, añade el siguiente encabezado 1: <h1>Página de ejemplo</h1>
9º A conrinuación, añade el siguiente encabezado 2: <h2>Texto normal</h2>.
10º Añade el siguiente párrafo: <p>El ñandú común es un ave sudamericana muy parecida al avestruz.</p>
11º Añade el siguiente párrafo: <p>Este ave, es omnivora y no puede volar, aunque es una gran corredora.</p>
12º Añade el siguiente párrafo con saltos: <p>Otras aves emparentadas con el ñandú son: <br/> - El avestruz<br/> - El amú<br/> -El kiwi.</p>
13º Añade el siguiente encabezado 2: <h3>Caracteres especiales</h3>.
14º Añade el siguiente párrafo: <p>El ñ andú comú n es un ave sudamericana muy parecida al avestruz.</p>.
15º Guarda la página y pruebala.
EJERCICIO
Añadiremos a nuestra página los siguientes encabezados y páginas.
Así se verá en un navegador:
Así se verá en un navegador:
El párrafo y los encabezados
Todo el texto del <body> debe estar dentro de parrafos. Los párrafos se identifican con la etiqueta <p></p>.
Dentro de los párrafos encontraremos el texto e imágenes, pero no podemos tener otros párrafos anidados. Tambien hay encabezados con los que podemos organizar el texto, van desde:
Por ejemplo <h1> para el rotulo principal de la página, <h2> para los titulos de los partados...
El texto de cada apartado se4 contiene en párrafos <p> </p>.
Los espacios en blanco del texto no se muestran como en el código fuente. Si hay espacios seguidos solo se mostrara uno. Por ejemplo:
Bienvenido a casa
se verá Bienvenido a casa.
El navegador ignorará los saltos de linea. Si dentro de un párrafo colocamos varios saltos de linea pulsando Intro, no se verán. Para crearlo utilizamos la etiqueta <br/>.
Dentro de los párrafos encontraremos el texto e imágenes, pero no podemos tener otros párrafos anidados. Tambien hay encabezados con los que podemos organizar el texto, van desde:
Por ejemplo <h1> para el rotulo principal de la página, <h2> para los titulos de los partados...
El texto de cada apartado se4 contiene en párrafos <p> </p>.
Los espacios en blanco del texto no se muestran como en el código fuente. Si hay espacios seguidos solo se mostrara uno. Por ejemplo:
Bienvenido a casa
se verá Bienvenido a casa.
El navegador ignorará los saltos de linea. Si dentro de un párrafo colocamos varios saltos de linea pulsando Intro, no se verán. Para crearlo utilizamos la etiqueta <br/>.
Ejercicio 5
Completa las siguientes frases:
a) Todo el documento HTML viene contenido dentro de la etiqueta
<html></html>.
b) La etiqueta <html>, encontramos dos subdivisiones:
d) La etiqueta <head> contiene información sobre la página. Normalmente, lo que contiene esta etiqueta no se muestra en el navegador.
a) Todo el documento HTML viene contenido dentro de la etiqueta
<html></html>.
b) La etiqueta <html>, encontramos dos subdivisiones:
- La cabecera delimitada por las etiquetas <head></head>
- El cuerpo delimitado por las etiquetas<body></body>
d) La etiqueta <head> contiene información sobre la página. Normalmente, lo que contiene esta etiqueta no se muestra en el navegador.
La estructura básica de una página
La etiqueta <head> contiene información sobre la página. Por ejemplo de que va la página, el titulo de la barra del navegador y estilos que pueden estar en el propio encabezado. Lo que contiene esta etiqueta no suele mostrarse en el navegador.
Obligatoriamente la etiqueta debe contener <title> y </title>, que contiene el titulo de la página.
Obligatoriamente la etiqueta debe contener <title> y </title>, que contiene el titulo de la página.
EJERCICIO
- Abre el bloc de notas.
- Escribe la siguiente pagina web.
- Guárdalo como ejercicio4.htm
- Observa el resultado en un navegador.
- Observa que <br/> produce un salto de linea.
- Observa que en la parte superior del navegador aparece el contenido <title></title
- Añade un salto de linea y un nuevo texto al final: "Esta asignatura está dedicada al diseño de paginas web"
Guárdalo como ejercicio4.html.
Después observa el resultado en un navegador
Estructura básica de una página
El documento HTML viene dentro de la etiqueta.
Dentro de la etique ta encontramos:
La cabecera delimitada por las etiquetas <head>, </head>
Y el cuerpo, delimitado por las etiquetas <body>, </body>
Obligatoriamente la etiqueta debe contener <title> y </title>, que contiene el titulo de la página.
En el <body> encontraremos el contenido de la página, lo que se ve a traves del navegador
EJERCICIO 2
EJERCICIO 2.
- Añade al ejercicio2.htm lo señalado en negrita.
- Guardalo como ejercicio3.htm
- Comprueba el resultado.
EJERCICIO 1
EJERCICIO 1.
- Abre la pagina ejercicio1.htm con el bloc de notas
- Añade las lineas en negrita.
Etiquetas
El lenguaje HTML se basa en etiquetas.
Las etiquetas siempre van contenidas entre los signos de desigualdad < >, que tienen una etiqueta de apertura y otra de cierre marcada por el signo /.
Entre las dos se encuentra el contenido de la etiqueta, algunas etiquetas no tienen contenido y se cierran sobre sí misma: <br /> seria lo mismo que <br><br/> (la etiqueta <br />
La primera palabra que aparece es el identificador de la etiqueta. Tambien podemos encontrar atributos con sus valores: <etiqueta atributo1="valor" atributo2="valor">
El nombre de la etiqueta y el atributo debe estar en minúscula, y los valores entre comillas.
Las etiquetas siempre van contenidas entre los signos de desigualdad < >, que tienen una etiqueta de apertura y otra de cierre marcada por el signo /.
<body> (Apertura)
<body/> (Cierre)
Entre las dos se encuentra el contenido de la etiqueta, algunas etiquetas no tienen contenido y se cierran sobre sí misma: <br /> seria lo mismo que <br><br/> (la etiqueta <br />
La primera palabra que aparece es el identificador de la etiqueta. Tambien podemos encontrar atributos con sus valores: <etiqueta atributo1="valor" atributo2="valor">
El nombre de la etiqueta y el atributo debe estar en minúscula, y los valores entre comillas.
Suscribirse a:
Entradas (Atom)