lunes, 15 de agosto de 2016
domingo, 14 de agosto de 2016
CUESTIONARIO NO 1
1 ¿Qué es html?
2 ¿Qué significa html?
3 ¿Qué es www?
4 ¿Qué necesitamos para utilizar html?
5 ¿Qué es un browser?
6 ¿Cuáles son las etiquetas básicas de un documento html?
7 ¿Cuál es la estructura básica de un documento html?
8 ¿Qué acción realiza la etiqueta Font color?
9 ¿Qué acción realiza la etiqueta Font size?
10 ¿Qué acción realiza la etiqueta Font face?
11 ¿Qué acción realiza la etiqueta H1?
12 ¿Qué acción realiza la etiqueta b?
13 ¿Qué acción realiza la etiqueta i?
14 ¿Qué acción realiza la etiqueta u?
15 ¿Qué acción realiza la etiqueta s?
16 ¿Qué acción realiza la etiqueta hr?
17 ¿Qué acción realiza la etiqueta br?
18 ¿Qué acción realiza la etiqueta hr color?
19 ¿Qué acción realiza la etiqueta hr width=50%?
20 ¿Qué acción realiza la etiqueta body?
viernes, 26 de febrero de 2016
Una de las primeras cosas que debemos aprender del HTML es la etiqueta <img> que funciona para colocar imágenes dentro de una página web.
Para poner una imágen utilizamos el siguiente código:
<img src="imagenHTML.jpg">
Donde "imagenHTML.jpg" es la imagen que vamos a colocar. Deberá estar ubicada en el mismo directorio. Si queremos colocar una imagen con HTML en una página que no está colocada dentro del mismo directorio, podemos usar una ruta absoluta:
<img src="folder/imagenHTML.jpg"
La etiqueta <img> tiene varias propiedas como son:
border, width, height, alt
Ejemplo con propiedades de imágen en HTML
<img src="imagenHTML.jpg" border="0" width="10" height="10">
El ancho y alto (width, height) se coloca en pixeles y deben corresponder al tamaño original de la imagen para que no se distorcione.
Los formatos soportados por el explorer son jpg, gif y png.
URL del artículo: http://www.ejemplode.com/17-html/81-ejemplo_de_como_colocar_imagenes_con_html.html
Nota completa: Cómo colocar imágenes con HTML
<img src="img1.gif" width="28" height="21" alt="Tamaño original" border="3">
<br>
<br>
<img src="img1.gif" width="68" height="21" alt="Achatada" border="0">
<br>
<br>
<img src="img1.gif" width="28" height="51" alt="Alargada" border="0">
<br>
<br>
<img src="img1.gif" width="56" height="42" alt="Doble grande" border="0">
es el primer codigo que se esta pidiendo que se ejecute
segundo codigo:
html>
<head>
<title>Titulo de tu pagina : PONER SECCION</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<link href="estilo2.css" media="screen" rel="StyleSheet" type="text/css">
</head>
<body bgcolor="#FFFFFF">
<!---- Principio Tabla Primera ---->
<table class="ancho99" width="99%" border="0px" cellspacing="0px" cellpadding="0px">
<tr>
<td class="a1">Logotipo</td>
<td class="a2">Banner</td>
</tr>
</table>
<!---- Principio Tabla Segunda ---->
<table class="ancho99" width="99%" border="0px" cellspacing="0px" cellpadding="0px">
<tr>
<td class="b1">titulo</td>
<td class="b2">ruta</td>
<td class="b3"><img src="atras.gif" width="13" height="19"> <img src="adelante.gif" width="13" height="19"></td>
</tr>
</table>
<!---- Principio Tabla Tercera ---->
<table class="ancho99" width="99%" border="0px" cellspacing="0px" cellpadding="0px">
<tr>
<td class="c1">
<p>menu</p>
</td>
<td class="c2">
<p>contenido</p>
</td>
</tr>
</table>
<!---- Principio Tabla Cuarta ---->
<table class="ancho99" width="99%" border="0px" cellspacing="0px" cellpadding="0px">
<tr>
<td class="d1">contador</td>
<td class="d2">opciones</td>
<td class="d3"><img src="atras.gif" width="13" height="19"> <img src="adelante.gif" width="13" height="19"></td>
</tr>
</table>
<!---- Principio Tabla Quinta ---->
<table class="ancho99" width="99%" border="0px" cellspacing="0px" cellpadding="0px">
<tr>
<td class="e1">fecha</td>
<td class="e2">hueco</td>
<td class="e3">firma</td>
</tr>
</table>
</body>
</html>
Añadir imágenes a tu sitio web o perfil en las redes sociales es una excelente manera de mejorar tu página. El código HTML para añadir imágenes es sencillo y por lo general es una de las primeras lecciones que aprenden quienes recién empiezan a utilizarlo.
Método 1 de 2: Insertando la imagen
-
1Sube tu imagen. Hay varios servicios gratuitos de alojamiento de imágenes, como Picasa Web Albums, Imgur, Flickr o Photobucket. Lee los términos cuidadosamente. Algunos servicios reducirán la calidad de tu imagen o la borrarán si mucha gente la ve (dado que usa el ancho de banda del servidor).
- Algunos servicios de alojamiento de blogs permiten que subas tus imágenes usando las herramientas de administrador del blog.
- Si pagaste por un servidor, sube la imagen a tu propio sitio usando un servicio FTP. Te recomendamos crear un directorio de imágenes para mantener tus archivos organizados.[1]
- Si quieres usar una imagen de otro sitio web, pide autorización al creador. Si te permite usarla, descarga la imagen y luego súbela a un sitio de alojamiento de imágenes.
-
2Abre tu archivo HTML. Abre el documento HTML para la página web donde se mostrará la imagen.
- Si tratas de insertar una imagen en un foro, puedes escribir directamente en la entrada. Varios foros usan un sistema personalizado en lugar de HTML. Pide ayuda a otros miembros del foro si no funciona.
-
3Empieza con la etiqueta de la imagen. Encuentra un punto en el cuerpo de tu HTML donde te gustaría insertar una imagen. Escribe la etiqueta <img> aquí. Esta es una etiqueta vacía, es decir, que está sola, sin una etiqueta de cierre. Todo lo que necesitas para mostrar tu imagen irá dentro de los dos paréntesis angulares.
- <img>
-
4Encuentra la URL de tu imagen. Visita la página web donde está alojada tu imagen. Haz clic derecho (control – clic en Mac) y selecciona Copiar locación de la imagen. También puedes hacer clic en Ver imagen para ver la imagen sola en la página y luego copiar la URL en tu barra de direcciones.
- Si subiste la imagen a un directorio de imágenes en tu propio sitio web, enlázala con /imágenes/elnombredetuarchivo. Si no funciona, entonces el directorio de imágenes probablemente esté dentro de otra carpeta. Muévela hasta el directorio raíz.
-
5Coloca la URL en un atributo src. Como ya debes saber, los atributos HTML van dentro de una etiqueta para hacer modificaciones. El atributo src es la forma abreviada de "source" y le indica al navegador dónde buscar para encontrar la imagen. Escribe src=" " y pega la URL de la imagen entre las comillas. Aquí hay un ejemplo:
- <img src="http://www.exampleimagehost.com/my-cute-dog.jpg">
-
6Añade un atributo alt. Técnicamente, tu HTML tiene todo lo necesario para mostrar la imagen, pero es mejor añadir también un atributo alt. Esto indica al navegador cuál texto mostrar cuando la imagen falla en cargar. Asimismo, sobre todo, ayuda a los motores de búsqueda a saber de qué se trata tu imagen y permite a los lectores de pantalla describir tu imagen a visitantes con problemas visuales.[2] Sigue este ejemplo cambiando el texto dentro de las comillas:
- <img src="http://www.exampleimagehost.com/my-cute-dog.jpg" alt="mi perro comiendo mandarina">
- Si la imagen no es importante para el contenido de la página, incluye el atributo alt sin texto (alt="").[3]
-
7Guarda tus cambios. Guarda tu archivo HTML en tu sitio web. Visita la página que acabas de editar o actualiza la página si ya la tienes abierta. Ahora, mira tu imagen. Si no tiene el tamaño correcto o no te gusta por otra razón, pasa a la siguiente sección.
Método 2 de 2: Ajustes opcionales
-
1Cambia el tamaño de la imagen. Para obtener mejores resultados, redimensiona la imagen usando un software de edición gratuito y luego sube la nueva versión. Establecer el ancho y el alto con HTML indica al navegador que reduzca o agrande la imagen, lo cual puede ser inconsistente entre los navegadores y causar (raramente) errores de visualización.[4] Si lo que buscas es un ajuste rápido y útil, usa este formato:
- <img src="http://example.com/example.png" alt="muestra esto" width=200 height=200> (Número de píxeles o "píxeles CSS" más enfocados a los teléfonos en HTML5)[5][6]
- o <img src="http://example.com/example.png" width=100% height=10%> (Porcentaje de las dimensiones de la página web o porcentaje del elemento HTML que contiene la imagen)
- Si ingresas solo un atributo (ancho o alto), el navegador debería preservar el ratio ancho:alto.
-
2Añade una descripción. El atributo título puede usarse para añadir comentarios adicionales o información acerca de la imagen. Por ejemplo, puedes citar al artista aquí. En la mayoría de los casos, este texto aparecerá cuando el visitante pase el puntero sobre la imagen.
- <img src="http://example.com/example.png" title="Fotografía de J. Godfrey">
-
3Hazla un enlace. Para hacer que una imagen sea también un enlace, inserta una etiqueta de imagen dentro de la etiqueta hiperenlace <a></a>. Aquí hay un ejemplo:
- <a href="http://www.urloflink.com><img src="http://urlofimage.com/image.gif"></a>
Suscribirse a:
Entradas (Atom)