SlideShare una empresa de Scribd logo
1 de 6
Colegio nacional nicolas esguerra
Edificamos futuro
Juan camilo ladino vallejo
Página web 4
Imagen <img>
Todas las páginas web acostumbran a tener un cierto número de imágenes, que permiten
mejorar su apariencia, o dotarla de una mayor información visual.
Para insertar una imagen es necesario insertar la etiqueta <img>. Dicha etiqueta no
necesita etiqueta de cierre.
En mi página copie esta imagen con el siguiente código
<img src="imagene
s/logo_animales.gif">
Texto alternativo
Cuando una imagen no puede ser visualizada en el navegador, cosa que puede ocurrir al
especificar mal el valor del atributo src, aparece un recuadro blanco con una X roja en su
lugar, junto con el nombre de la imagen.
Podemos hacer que en lugar de mostrarse el nombre de la imagen aparezca el texto que
nosotros deseemos, gracias al atributo alt.
Por ejemplo, imagina que deseamos mostrar una imagen llamada gatito.gif, con el texto
alternativo Imagen gato, para ello insertamos el siguiente código:
<img src="gatito.gif" alt="Imagen gato" >
En mi caso puse una imagen gif con los mismop que decía el profesor
Borde de una imagen
Lo negro es el borde
Alineación de una imagen
Este cuadro nos indica como alinear las imágenes en micaso puse un gif de ejemplo abajo
esta
Listo haora mi pagina web esta terminada deacuerdo con lo q ue el profesor dejo en clase
Estos son los resultados
<title>esta es mi tienda de automoviles S.A</title>
</head>
<!--pagina web elaborada por juan camilo ladino vallejo 904 //-->
<body bgcolor="000066">
<hr>
<MARQUEE><B><I>SEAN BIEVENIDOS A MI
EMPRESA</B></I></MARQUEE><br>
<hr>
<H3> mi empresa brinda la mayor calidad de automoviles de todo el
pais</H3><br>
<font color="990000" size="5" face="Arial"><b>bienvenidos a a mi tienda de compra y
venta de carros</B></font>
<font color="ffff00" size="4" face="Arial"><b>recien llegado de europa el nuevo Hyundai
i25 </B></font><br>
<img src="imagenes/índice.jpg "border="9" "width="200" height="180"><img
src="comodidad.jpg"border="5" "width="200" height="180">
<img src="imagenes/giphyhgfytr.gif "border="9" "width="200" height="180"><img
src="comodidad.jpg"border="5" "width="200" height="180">
<img src="imagenes/comodidad.jpg "border="9" "width="200" height="180"><img
src="comodidad.jpg"border="5" "width="200" height="180">
<P ALIGN="CENTER">el nuevo hyundai i25 es de una exelnte calidad puesto q su
comodidad es muy deseada por nustros comoradores el motor es lo ultimo en motores q
hyundai a sacado en este 2015 ademas cuenta con un diseño ergonomico y su relacion
calidad precio no disgustara a nuestros compradores en absoluto.</p>
<font color="cc0000" size="5" face="Cooper Black"><b>HYUNDAI</B></font>
<font color="000000" size="4" face="Segoe UI Black"><b>calidad y comodidad
garantizada</B></font>
<img src="imagenes/images.jpg "border="10" "width="200" height="180"><img
src="comodidad.jpg"border="5" "width="200" height="180">
<img src="imagenes/giphy.gif "border="10" "width="200" height="180"><img
src="comodidad.jpg"border="5" "width="200" height="180">
<hr align="center" width="100%" size="10"color=660000" noshade>
<pre> copyrigh 2015
colegio nacional nicolas esguerra
CALLE 95 CRA 32 NO 184 BOGOTA COLOMBIA (al lado del c.c
titan plaza)
comprayventadecarrosSA@gmail.com</pre>
</body>
</html>

Más contenido relacionado

La actualidad más candente

Quiero aprender WordPress ¿Por donde empiezo?
Quiero aprender WordPress ¿Por donde empiezo?Quiero aprender WordPress ¿Por donde empiezo?
Quiero aprender WordPress ¿Por donde empiezo?Mauricio Gelves
 
SemanaWP #3 - Campos personalizados sin limites en WooCommerce
SemanaWP #3 - Campos personalizados sin limites en WooCommerceSemanaWP #3 - Campos personalizados sin limites en WooCommerce
SemanaWP #3 - Campos personalizados sin limites en WooCommerceOscar Abad Folgueira
 
Codigos de textos en html y parrafos
Codigos de textos en html y parrafosCodigos de textos en html y parrafos
Codigos de textos en html y parrafosSñrta Barahona
 
Edificamosfuturo
Edificamosfuturo Edificamosfuturo
Edificamosfuturo BDBT
 
Html archivo ((completo))
Html archivo ((completo))Html archivo ((completo))
Html archivo ((completo))BDBT
 

La actualidad más candente (9)

Quiero aprender WordPress ¿Por donde empiezo?
Quiero aprender WordPress ¿Por donde empiezo?Quiero aprender WordPress ¿Por donde empiezo?
Quiero aprender WordPress ¿Por donde empiezo?
 
Dreamweaver cs5
Dreamweaver cs5Dreamweaver cs5
Dreamweaver cs5
 
SemanaWP #3 - Campos personalizados sin limites en WooCommerce
SemanaWP #3 - Campos personalizados sin limites en WooCommerceSemanaWP #3 - Campos personalizados sin limites en WooCommerce
SemanaWP #3 - Campos personalizados sin limites en WooCommerce
 
Pagina web
Pagina webPagina web
Pagina web
 
Html00000
Html00000Html00000
Html00000
 
Codigos de textos en html y parrafos
Codigos de textos en html y parrafosCodigos de textos en html y parrafos
Codigos de textos en html y parrafos
 
Xhtml fundamentos
Xhtml  fundamentosXhtml  fundamentos
Xhtml fundamentos
 
Edificamosfuturo
Edificamosfuturo Edificamosfuturo
Edificamosfuturo
 
Html archivo ((completo))
Html archivo ((completo))Html archivo ((completo))
Html archivo ((completo))
 

Similar a Pagina web 4 (20)

Imagen &lt;img>
Imagen &lt;img>Imagen &lt;img>
Imagen &lt;img>
 
Pagina web iv
Pagina web ivPagina web iv
Pagina web iv
 
Colegio nacional nicolas esguerra
Colegio nacional nicolas esguerraColegio nacional nicolas esguerra
Colegio nacional nicolas esguerra
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Dvbgsdbf
DvbgsdbfDvbgsdbf
Dvbgsdbf
 
Imagenes
ImagenesImagenes
Imagenes
 
Imagenes
ImagenesImagenes
Imagenes
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
pagina web IV
pagina web IVpagina web IV
pagina web IV
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Pagina web 4.
Pagina web 4.Pagina web 4.
Pagina web 4.
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Martin lopoez 905
Martin lopoez 905Martin lopoez 905
Martin lopoez 905
 
Martin lopoez 905 30
Martin lopoez 905 30Martin lopoez 905 30
Martin lopoez 905 30
 
Pagina web 4
Pagina web 4Pagina web 4
Pagina web 4
 
Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Colegio nacional nicolás es guerra
Colegio nacional nicolás es guerraColegio nacional nicolás es guerra
Colegio nacional nicolás es guerra
 
Colegio nacional nicolas4
Colegio nacional nicolas4Colegio nacional nicolas4
Colegio nacional nicolas4
 

Más de Daniel Franco Cardona (20)

Pagina web 5
Pagina web 5Pagina web 5
Pagina web 5
 
Pagina web 3
Pagina web 3Pagina web 3
Pagina web 3
 
Pagina web 2
Pagina web 2Pagina web 2
Pagina web 2
 
Pagina web 1
Pagina web 1Pagina web 1
Pagina web 1
 
Franco
FrancoFranco
Franco
 
Crucigrama
CrucigramaCrucigrama
Crucigrama
 
Presentación1
Presentación1Presentación1
Presentación1
 
Presentación1
Presentación1Presentación1
Presentación1
 
Lego mindstorms 2 software
Lego mindstorms 2 softwareLego mindstorms 2 software
Lego mindstorms 2 software
 
Lego mindstorms hardware
Lego mindstorms hardwareLego mindstorms hardware
Lego mindstorms hardware
 
Corel draw
Corel draw Corel draw
Corel draw
 
Presentación1
Presentación1Presentación1
Presentación1
 
Secuencias scratch
Secuencias scratchSecuencias scratch
Secuencias scratch
 
Variables scratch
Variables scratchVariables scratch
Variables scratch
 
Variables scratch
Variables scratchVariables scratch
Variables scratch
 
Secuencias scratch
Secuencias scratchSecuencias scratch
Secuencias scratch
 
Unidad10
Unidad10Unidad10
Unidad10
 
Unidad 9
Unidad 9Unidad 9
Unidad 9
 
Mapaconceptual
MapaconceptualMapaconceptual
Mapaconceptual
 
Unidad 3 :3
Unidad 3 :3Unidad 3 :3
Unidad 3 :3
 

Último

¡Explora el boletín del 29 abril de 2024!
¡Explora el boletín del 29 abril de 2024!¡Explora el boletín del 29 abril de 2024!
¡Explora el boletín del 29 abril de 2024!Yes Europa
 
CONTRATO DE TRABAJO, remuneraciones y otros datos
CONTRATO DE TRABAJO, remuneraciones y otros datosCONTRATO DE TRABAJO, remuneraciones y otros datos
CONTRATO DE TRABAJO, remuneraciones y otros datosJENNIFERBERARDI1
 
FASES DE LA CONSULTORÍA- parte 1aa.pptx
FASES DE LA CONSULTORÍA- parte 1aa.pptxFASES DE LA CONSULTORÍA- parte 1aa.pptx
FASES DE LA CONSULTORÍA- parte 1aa.pptx10ColungaFloresJosSa
 
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdf
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdfDIARIO EL PERUANO 19-06-202hhhhhhhh3.pdf
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdfhugorebaza00
 
-PEIC-NUEVO de plantel educativo Venezuela
-PEIC-NUEVO de plantel educativo Venezuela-PEIC-NUEVO de plantel educativo Venezuela
-PEIC-NUEVO de plantel educativo VenezuelaJESUS341998
 
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICO
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICOMODERNISMO VS POSMODERNISMO CUADRO SINOPTICO
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICOIreneGonzalez603427
 

Último (6)

¡Explora el boletín del 29 abril de 2024!
¡Explora el boletín del 29 abril de 2024!¡Explora el boletín del 29 abril de 2024!
¡Explora el boletín del 29 abril de 2024!
 
CONTRATO DE TRABAJO, remuneraciones y otros datos
CONTRATO DE TRABAJO, remuneraciones y otros datosCONTRATO DE TRABAJO, remuneraciones y otros datos
CONTRATO DE TRABAJO, remuneraciones y otros datos
 
FASES DE LA CONSULTORÍA- parte 1aa.pptx
FASES DE LA CONSULTORÍA- parte 1aa.pptxFASES DE LA CONSULTORÍA- parte 1aa.pptx
FASES DE LA CONSULTORÍA- parte 1aa.pptx
 
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdf
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdfDIARIO EL PERUANO 19-06-202hhhhhhhh3.pdf
DIARIO EL PERUANO 19-06-202hhhhhhhh3.pdf
 
-PEIC-NUEVO de plantel educativo Venezuela
-PEIC-NUEVO de plantel educativo Venezuela-PEIC-NUEVO de plantel educativo Venezuela
-PEIC-NUEVO de plantel educativo Venezuela
 
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICO
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICOMODERNISMO VS POSMODERNISMO CUADRO SINOPTICO
MODERNISMO VS POSMODERNISMO CUADRO SINOPTICO
 

Pagina web 4

  • 1. Colegio nacional nicolas esguerra Edificamos futuro Juan camilo ladino vallejo Página web 4 Imagen <img> Todas las páginas web acostumbran a tener un cierto número de imágenes, que permiten mejorar su apariencia, o dotarla de una mayor información visual. Para insertar una imagen es necesario insertar la etiqueta <img>. Dicha etiqueta no necesita etiqueta de cierre. En mi página copie esta imagen con el siguiente código <img src="imagene s/logo_animales.gif">
  • 2. Texto alternativo Cuando una imagen no puede ser visualizada en el navegador, cosa que puede ocurrir al especificar mal el valor del atributo src, aparece un recuadro blanco con una X roja en su lugar, junto con el nombre de la imagen. Podemos hacer que en lugar de mostrarse el nombre de la imagen aparezca el texto que nosotros deseemos, gracias al atributo alt. Por ejemplo, imagina que deseamos mostrar una imagen llamada gatito.gif, con el texto alternativo Imagen gato, para ello insertamos el siguiente código: <img src="gatito.gif" alt="Imagen gato" > En mi caso puse una imagen gif con los mismop que decía el profesor Borde de una imagen Lo negro es el borde
  • 3. Alineación de una imagen Este cuadro nos indica como alinear las imágenes en micaso puse un gif de ejemplo abajo esta
  • 4. Listo haora mi pagina web esta terminada deacuerdo con lo q ue el profesor dejo en clase Estos son los resultados <title>esta es mi tienda de automoviles S.A</title> </head> <!--pagina web elaborada por juan camilo ladino vallejo 904 //--> <body bgcolor="000066"> <hr> <MARQUEE><B><I>SEAN BIEVENIDOS A MI EMPRESA</B></I></MARQUEE><br> <hr> <H3> mi empresa brinda la mayor calidad de automoviles de todo el pais</H3><br> <font color="990000" size="5" face="Arial"><b>bienvenidos a a mi tienda de compra y venta de carros</B></font> <font color="ffff00" size="4" face="Arial"><b>recien llegado de europa el nuevo Hyundai i25 </B></font><br>
  • 5. <img src="imagenes/índice.jpg "border="9" "width="200" height="180"><img src="comodidad.jpg"border="5" "width="200" height="180"> <img src="imagenes/giphyhgfytr.gif "border="9" "width="200" height="180"><img src="comodidad.jpg"border="5" "width="200" height="180"> <img src="imagenes/comodidad.jpg "border="9" "width="200" height="180"><img src="comodidad.jpg"border="5" "width="200" height="180"> <P ALIGN="CENTER">el nuevo hyundai i25 es de una exelnte calidad puesto q su comodidad es muy deseada por nustros comoradores el motor es lo ultimo en motores q hyundai a sacado en este 2015 ademas cuenta con un diseño ergonomico y su relacion calidad precio no disgustara a nuestros compradores en absoluto.</p> <font color="cc0000" size="5" face="Cooper Black"><b>HYUNDAI</B></font> <font color="000000" size="4" face="Segoe UI Black"><b>calidad y comodidad garantizada</B></font> <img src="imagenes/images.jpg "border="10" "width="200" height="180"><img src="comodidad.jpg"border="5" "width="200" height="180"> <img src="imagenes/giphy.gif "border="10" "width="200" height="180"><img src="comodidad.jpg"border="5" "width="200" height="180"> <hr align="center" width="100%" size="10"color=660000" noshade> <pre> copyrigh 2015 colegio nacional nicolas esguerra CALLE 95 CRA 32 NO 184 BOGOTA COLOMBIA (al lado del c.c titan plaza) comprayventadecarrosSA@gmail.com</pre>