Cómo insertar imagenes en una pagina
Ahora trataremos con detalle el mundo de las imágenes en el WWW y aprenderemos todas las posibilidades gráficas que ofrece. En esta parte aprenderemos, como introducción, a insertar imágenes para dar mas vida a nuestra página.
La etiqueta usada para insertar imágenes es: Esta etiqueta está compuesta por una única instrucción y por tanto no existe y su uso está prohibido. Podemos insertar una imagen en medio de una frase como si fuese una palabra más de ella y será mostrada por el navegador a continuación del texto (o cualquier otro elemento anterior).
La manera de insertar una imagen es así:
">
Para ponerle el tamaño, usamos: WIDTH="un valor" (para el ancho)... y para el largo: HEIGHT="un valor"
De tal manera que:
link de la imagen, o ubicación " WIDTH=" xx " HEIGHT=" xx ">
Como crear Enlaces
Para crear enlaces, hacemos lo siguiente:
el link a enlazar "alt= "Lo que queremos que se muestre al situar el cursor sobre el enlace ">
La etiqueta FONT
Cambiando el tamaño del texto
1- La primera de ellas es indicar un tamaño absoluto de 1 a 7. Correspondiendo 7 al tamaño mayor y 1 al menor. El tamaño por defecto del texto es el equivalente al número 3. Veamos un ejemplo:
Aqui la comparación de todos los tamaños:
2- La segunda consistirá en indicar un tamaño relativo respecto al que haya por defecto. Por ejemplo, para poner un tamaño 6 y suponiendo un tamaño por defecto 3 se usaría:
Este texto sigue teniendo tamaño 4
Cambiando el color del texto
Y la forma de usarlas queda clara en el siguente ejemplo:
Colores en el Web
ya podemos decir que sabemos poner colores en
Quedaria así:Cómo se crea una tabla HTML
El uso de las instrucciones de fin de TR, TD y TH es, como hemos dicho, optativo. Sin embargo en las primeras versiones del lenguaje HTML era obligatorio usarlas y por esta razón algunos navegadores antiguos las necesitan para poder entender las tablas. Es por ello que nuestra recomendación es usar siempre dichas instrucciones de fin para seguir con nuestro objetivo de llegar a la mayor cantidad de público posible. |
Para empezar crearemos una tabla sencilla de dos filas y dos elementos. Vayamos por pasos:
2. A continuación insertamos las filas. La tabla que nos hemos propuesto crear consta de dos filas. Por tanto
debemos usar la etiqueta TR dos veces. Lo que insertemos en la primera (entre la instrucción de inicio y la
instrucción de fin) será el contenido de la primera fila y lo que insertemos en la segunda será el contenido
de la segunda fila: 3. El tercer paso será definir el contenido de cada fila. Como nos habíamos propuesto que la tabla tuviese dos columnas en cada fila debemos insertar dos celdas en cada una. Como hemos explicado antes, para crear una celda debemos usar la etiqueta TD. Entre la instrucción de inicio y la instrucción de fin de está etiqueta será donde insertaremos el verdadero contenido de la tabla. En este primer ejemplo sencillo será simplemente texto, pero puede ser cualquier otro elemento web como imágenes o listas. Volviendo a nuestro ejemplo, para cada fila debemos escribir el siguiente código:
Columna1
Columna2
En los ejemplos que veremos a lo largo de este curso sangraremos las etiquetas a distintos niveles para que se
a más sencillo saber que etiquetas están dentro de otras. No es necesario realizar esto para que el código
funcione,de hecho podríamos escribir el código en una sola línea y también funcionaría, pero si es recomendable
ya que nos facilita mucho su lectura.
El cuarto paso es ponerlo todo junto, repitiendo el código anterior para cada fila. El código final de la tabla
será:
Fila1,Columna1
Fila1,Columna2
Fila2,Columna1
Fila2,Columna2
Borde de las tablas
El siguiente paso en el aprendizaje de las tablas consiste en añadirles un borde. Esto es tan sencillo como añadir un nuevo atributo a la instrucción de inicio de la etiqueta TABLE. El atributo del que hablamos es BORDER, que significa borde en inglés. Este atributo puede tomar un valor en pixeles que representa el grosor del borde a mostrar. Si incluimos BORDER sin ningún valor es equivalente a BORDER="1" Repitamos el segundo de los ejemplos vistos antes pero añadiéndole un borde de grosor 5.
Esto ha sido todo!
Esperamos te haya sido de ayuda!
Se despide Jeferx =)