Introducción a HTML
- 2. ¿Qué es, que hace? Lenguaje de marcas de texto. Es simplemente un procesador de texto, como el que ofrecen los sistemas operativos Windows (Bloc de notas), UNIX(el editor vi o ed) o el que ofrece MS Office (Word). ¿Qué no es, que no hace? HTML no es propiamente un lenguaje de programación como C++,Visual Basic, etc. No presenta ningún compilador, por lo tanto algún error de sintaxis que se presente éste no lo detectará,
- 3. ¿Que es? Se puede decir que será un texto incluido entre los símbolos <….> este texto será una orden para que explique la utilidad de la etiqueta, y es indistinto que se escriba en mayúsculas o minúsculas se le puede decir comando o código. Tipos Cerradas: Son aquellas que tienen una etiqueta que indica el principio de la directiva y otra que indica el final. La del final contendrá el mismo texto añadiendo al principio del carácter el símbolo /. Ejemplo: <center>…………….</center> Abiertas: Las directivas abiertas por el contrario constan de una sola etiqueta Ejemplo: <hr>, <br>
- 4. <HTML> Indica el inicio del documento <HEAD> Indica el inicio del encabezado <TITLE> Indica el inicio del titulo <META> Se utiliza para añadir información sobre la página </TITLE> Indica el final del titulo </HEAD> Indica el final del encabezado <BODY> Indica el final del cuerpo </BODY> Indica el final del cuerpo </HTML> Indica el final del documento
- 5. <Body bgcolor=“red”>……………………. </Body> Complemento de directiva nos permite poner color en el fondo del documento este debe estar escrito en ingles y también se lo puede poner en sistema hexadecimal <Body background=“C:/mis_imagenes”>……… </Body> Complemento de directiva nos permite poner una imagen en el fondo del documento debemos escribir la dirección por completo de donde esta la imagen. Para evitar inconvenientes es mejor ubicar todo las imágenes y documentos que manejamos en una sola carpeta y así nos ahorramos escribir direcciones completas, solo nombres.
- 6. Mediante los títulos, en sus diferentes niveles de importancia, podemos definir el esqueleto del documento, su estructura básica. <h1>Mucha importancia</h1> <h2>Menos importancia</h2> <h3>Mucha menos importancia</h3>
- 7. Mediante estos atributos determinamos el estilo y el tipo de letra que tendrá la presentación del documento final <font> para definir partes limitadas de texto </font> <font face=“tipo de letra”> define tipo de letra a visualizar </font> <font color=color> define color de letra a visualizar</font> <font size= # > define tamaño de letra a visualizar se debe poner un numero natural </font> Aunque todas esta directivas pueden usarse en una sola línea por ejemplo <font face=“arial” color=“red” size=10>……………….</font>
- 8. SE PUEDEN DAR TAMBIÉN LOS ATRIBUTOS MÁS TRADICIONALES: NEGRITA Y CURSIVA, ETC. <br> para marcar un fin de una línea <p> para marcar un fin de párrafo</p> <b>esto en negrita</b> <i>esto en cursiva</i> <u>esto es subrayado</u> <s> esto es tachado</s>
- 9. <marquee> Texto o imagen que queremos animar </marquee> <marquee direction=“up”> de abajo hacia arriba </marquee> <marquee direction=“down”> de arriba hacia abajo </marquee> <marquee direction=“right”> de derecha a izquierda </marquee> <marquee direction=“left”> de izquierda a derecha </marquee> <marquee behavior=“alternate”> izquierda a derecha y viceversa </marquee>
- 10. Esto es una lista no numerada: <ul> <li>Tomates <li>Zanahorias <li>Perros </ul> Se puede utilizar el complemento: <ul type=“square”> para viñetas rectangulares. <ul type=“circle”> para viñetas circulares. La directiva <li> Se utiliza para cada uno de los elementos de una lista.
- 11. Esto una lista numerada: <ol> <li>Miguel Induráin <li>Tony Rominger <li>Eugeni Berzin </ol> Se puede utilizar el complemento: <ol style= I > para una lista en números romanos. La directiva <li> Se utiliza para cada uno de los elementos de una lista.
- 12. <Img src=“c:/mis_documentos/mipag/imagen.jpg”> Permite poner imágenes de tipo jpg, gif, pcg, etc en el documento o pagina, dentro de las comillas debemos digitar la dirección completa del lugar donde esta la foto VIDEOS <embed src=“c:/mis_documentos/mipag/video.mpg”> Permite poner videos de tipo avi, mpg, mp4, etc. En el documento o pagina, dentro de las comillas debemos digitar la dirección completa del lugar donde esta el video
- 13. La manera que insertar videos de youtube a nuestra pagina o documento es la siguiente: En la pagina de youtube encontraremos estas opciones Presionamos “compartir” Entonces nos aparece otros botones: Al darle clic en el botón insertar aparecerá un código lo copiamos íntegramente sin hacer cambios e insertamos en el documento justo en el lugar donde queramos que el video aparezca
- 14. La manera que insertar diapositivas a nuestra pagina o documento es la siguiente: En la pagina en la cual visualicemos las diapositivas encontraremos estas opciones Nos aparecerá un código lo copiamos íntegramente sin hacer cambios e insertamos en el documento justo en el lugar donde queramos que el video aparezca