etiquetas html - Creaciones y Desarrollo Web

Transcripción

ETIQUETAS HTML
El código HTML lo podemos escribir en el Block de Notas o en Workpad al terminar de
digitarlo lo guardamos y cambiamos la extensión a HTML. Y cuando queramos hacer
cambios simplemente presionamos el click derecho sobre el archivo seleccionamos la
opción de abrir con y escogemos el programa con el que lo escribimos ya sea Block de
Notas o el Workpad o el deseado.
Hay que tener presente que toda etiqueta HTML empieza con el signo menor que “<” y
termina con el signo mayor que “>”.
Etiquetas Principales para un documento HTML
<html> indica el inicio del documento HTML
<head> indica el encabezado del documento HTML
</head> indica el final del encabezado del documento
<body> inicio del cuerpo del documento HTML
Aquí va el contenido a mostrar al usuario final
</body> Indica el final del cuerpo
</html> Indica el final del Documento HTML
Ver Ejemplo en línea
Descargar Ejemplo 1
Etiquetas Principales que van dentro de las etiquetas <head> y </head>
Dentro de las etiquetas que marcan nuestro encabezado encontramos algunas etiquetas
como:
<title> </title> Esta muestra el titulo de nuestro documento o ventana
<style></style> Para definir estilos como colores, tamaños, fondos, entre otros atributos
de presentación que podamos definir y dar mejor apariencia a nuestros documentos
Si quieres aprender más de stylos visita nuestros Tutoriales de hojas cascadas o CSS.
<javascript></javascript> Para indicar funciones y programación en javascript
También dentro de estas etiquetas podemos meter la etiqueta <Meta> que es para la
información para los buscadores así como también la etiqueta <link> que sirve para
ligar hojas de estilo (css) a nuestro documento.
Ejemplo:
<html>
<head>
<title> Mi primer HTML</title>
</head>
<body>
Aquí va el contenido a mostrar al usuario final
</body>
</html>
Ver Ejemplo
Descargar Ejemplo
Etiquetas Principales que van dentro de las etiquetas <body> y </body>
Dentro de estas etiquetas como aquí va todo lo mostrar al usuario final encontramos
gran cantidad de etiquetas.
ETIQUETA
<b></b>
<u></u>
<h1><h1>
<center></center>
<p></p>
<br>
<img />
EXPLICACION
Todo lo que este dentro de
estas etiquetas se mostrara
como texto en negrita.
Ejemplo:
<b>Texto en Negrita</b>
como texto subrayado.
Ejemplo:
<u>Texto Subrayado</u>
Crea encabezados Ejemplos:
<h1>Encabezado 1<h1>
como texto centrado.
Ejemplo:
<center>Texto
Centrado</center>
Inicio y final de un párrafo
Ejemplo:
<p>Párrafo 1</p>
<p>Párrafo 2</p>
Salto de línea
Para insertar imágenes
Ejemplo:
<img
src=”imágenes/img1.jpg”
alt=”Mi primer imagen” />
ATRIBUTOS
Height=”n” indica el
ancho
Width=”n” indica el alto
Alt=”d” cuando se coloca
encima el cursor el texto a
mostrar
Border=”n” si desea que la
imagen tenga un borde
Src=”d” indica la ruta
donde se encuentra la
imagen a mostrar.
D=descripción
N=valor numerico
De todos estos atributos
solo el src es obligado los
demas son para formato
<ol><li></li></ol>
<ul><li></li></ul>
<a></a>
Listas ordenadas por números
o letras
Ejemplo:
<ol>
<li type=”a”>Elemento 1
</li>
</li>
</li>
</ol>
Listas desordenadas Ejemplo:
<ul>
<li type=”circle”>Elemento 1
</li>
<li type=” circle”>Elemento
2 </li>
<li type=” circle”>Elemento
3 </li>
</ul>
Este permite hacer enlaces a
diferentes documentos
Ejemplos:
<a href=”pagina2.html”>Ir a
página 2</a>
<a
href=”pagina2.doc”>Enlace a
documento de work</a>
href=”mailto:dircorreo”>Abre
el Outlook para enviar
correo</a>
<table></table>
Crea tablas
<tr></tr>
<td></td>
Crea una fila
Crea una columna
Type=”t” indica el tipo de
lista si es en letras o en
numeros
Entre los tipos “t”
tenemos:
a= minúsculas
A= mayúsculas
1= números
I=romanos
Type=”t” indica el tipo de
lista
Entre los tipos “t”
tenemos:
circle
disc
square
href=”d” indica la ruta al
hacer el enlace
Border=”n” Numerico,
indica si lleva borde y que
ancho, no es obligatorio
Caption=”d” Texto, indica
el titulo de la tabla, no es
obligatorio
Widht=”N”, ancho
Heigth=”N” alto
Background=”” Color de
fondos, numero
hexadecimal que indica el
color
Colspan=”N” cantidad de
columnas a ocupar
Rowspan=”N” cantidad de
filas a ocupar
Aling=”” si es
centrado,justificado,
alineado a la derecha o
alineado a la izquierda
(cener,justify,rigth,left)
Valing=”” top,center
indica si la colunma es
muy alta de que forma se
acomodaran los valores
arriba,abajo, centrado
Ejemplo completo de la tabla:
<table>
<tr>
<td>Celda 1:1</td>
<td>Celda 1:2</td>
<td>Celda 1:3</td>
</tr>
<tr>
<td>Celda 2:1</td>
<td>Celda 2:2</td>
<td>Celda 2:3</td>
</tr>
<tr>
<td colspan=”2”
aling=”center”>Celda
combinada y
centrada2:1</td>
<td>Celda 2:3</td>
</tr>
</table>
Ver Ejemplo
Descargar Ejemplo

etiquetas html - Creaciones y Desarrollo Web

Transcripción

Documentos relacionados

ETIQUETA TERMICA 38X113 PROT.BL. PRECORTE

Impresion de Etiquetas

¿cómo se promociona un producto o servicio?