tutorial html: marzo 2014

Videos HTML

Videos

1: Como insertar una imagen de fondo

2: Como insertar una imagen, alinearla, fondos de pàgina.

https://www.youtube.com/watch?v=jncvGCHXPAc

3 : Tutorial con block de notas

https://www.youtube.com/watch?v=-Dxuvv4KTeg

HTML es un lenguaje de programación que se utiliza para el desarrollo de páginas de Internet. Se trata de la sigla que corresponde a HyperText Markup Language, es decir,Lenguaje de Marcas de Hipertexto, que podría ser traducido como Lenguaje de Formato de Documentos para Hipertexto.

Se trata de un formato abierto que surgió a partir de las etiquetas SGML (Standard Generalized Markup Language). Concepto traducido generalmente como “Estándar de Lenguaje de Marcado Generalizado” y que se entiende como un sistema que permite ordenar y etiquetar diversos documentos dentro de una lista. Este lenguaje es el que se utiliza para especificar los nombres de las etiquetas que se utilizarán al ordenar, no existen reglas para dicha organización, por eso se dice que es un sistema de formato abierto.

EL HTML se encarga de desarrollar una descripción sobre los contenidos que aparecen como textos y sobre su estructura, complementando dicho texto con diversos objetos (como fotografías, animaciones, etc).

Es un lenguaje muy simple y general que sirve para definir otros lenguajes que tienen que ver con el formato de los documentos. El texto en él se crea a partir de etiquetas, también llamadas tags, que permiten interconectar diversos conceptos y formatos.

Etiquetas html

El lenguaje HTML es un lenguaje de marcas, estas marcas serán fragmentos de texto destacado de una forma especial que permiten la definición de las distintas instrucciones de HTML, tanto los efectos a aplicar sobre el texto como las distintas estructuras del lenguaje. A estas marcas las denominaremos etiquetas y serán la base principal del lenguaje HTML. En documento HTML será un fichero texto con etiquetas que variarán la forma de su presentación.
Una etiqueta será un texto incluido entre los símbolos menor que < y mayor que >.. El texto incluido dentro de los símbolos será explicativo de la utilidad de la etiqueta. Por ejemplo:

<B>	Letra Negrita, del inglés Bold (negrita).
<TABLE>	Definirá una tabla.
<IMG>	Inclusión de una IMaGen.

Existe normalmente una etiqueta de inicio y otra de fin, la de fin contendrá el mismo texto que la de inicio añadiéndole al principio una barra inclinada /. El efecto que define la etiqueta tendrá validez para todo lo que este incluido entre las etiquetas de inicio y fin, ya sea texto plano o otras etiquetas HTML.

<ETIQUETA>Elementos Afectados por la Etiqueta</ETIQUETA>
 Por ejemplo, con la etiqueta siguiente:

 Texto que será en negrita.

 Obtendremos:

 Texto que será en negrita
 Algunas etiquetas no necesitarán la de fin, serán aquellas en las que el final este implícito, por ejemplo  párrafo,   salto de línea ó <IMG> inclusión de una imagen. Definen un efecto que se producirá en un punto determinado sin afectar a otros elementos.
 El uso de mayúsculas o minúsculas en las etiquetas es indiferente, se interpretarán del mismo modo en ambos casos, pero lo normal es expresarlas en mayúsculas para que destaquen con más nitidez del texto normal.

Ejercicios

Práctica 1

Ejemplo de Acentos, caracteres especiales y comentarios

<html>

<head>

<title>Mi primera página en html</title>

</head>

<body>

las etiquetas que hemos aprendido hasta ahora son las que forman la

estructura básica de un documento html: <html>, <head>,

<title> y <body>. también hemos aprendido a comentar

nuestras páginas con las etiquetas .

</body>

</html>

Práctica 2

Ejemplos de tamaños

<html>

<head>

<title>Ejercicio sobre tamaños y formatos</title>

</head>

2. El cuerpo del documento quedaría como el siguiente:

<body>

Esto está a un tamaño de 40px

Esto está a un tamaño small

Esto está a un tamaño medium

Esto está a un tamaño large

Esto está a un tamaño xx-large

Esto está a un tamaño xx-small

Esto está a un tamaño 2%

Esto está a un tamaño 20%

Esto está a un tamaño 80%

Esto está a un tamaño 200%

Esto está a un tamaño 300%

<h2>Pruebas de formatos</h2>

Esto es normal

y esto es subíndice: sub

Esto es normal y esto es superíndice: sup

</body>

</html>

Pràctica 3

Ejemplos de colores

<html>

<head>

<title>colores</title>

</head>

2) El cuerpo del documento quedaría como el siguiente:

#000000 negro

#FFFFFF blanco

#FF0000 rojo

#00FF00 verde

#0000FF azul

#FFFF00 amarillo

#FF00FF

morado,mezcla de rojo y azul

</body>

</html>

Pràctica 4

Ejemplo de imagen de fondo

<html>

<h3>Ejemplo de imagen de fondo</h3>

se puede utilizar archivos en formatos jpg, gif o png.No es recomendable otro formato.

si la imagen es màs pequeña que la pàgina, se repetirà en mozaico.>

</body>

</html>

Pràctica 5

Ejemplo de lista

<ol type="i">
<li>Perro</li>
<li>Gato</li>
<li>Periquito</li></ol>

Sus elementos

Elementos

. Los Elementos Son La Estructura Básica de HTML Los Elementos Tienen DOS Propiedades Básicas: Atributos y Contenido. Cada, ATRIBUTO y Contenido Tiene ciertas Restrictions Parr Que se considerará válido si al Documento HTML. Un Elemento generalmente Tiene Una Etiqueta de inicio (EJEMPLO POR, <nombre-de-elemento> ) y Una Etiqueta de Cierre (EJEMPLO POR, </ Nombre-de-Elemento> ). Los Atributos del Elemento estan Contenidos en la Etiqueta de inicio y el Contenido no no no está UBICADO Entre las dos ETIQUETAS (EJEMPLO POR, <nombre-de-elemento atributo="valor"> Contenido </ Nombre-de-Elemento> ). Algunos Elementos, cuentos de Como   , no TIENEN Contenido ni Llevan Una Etiqueta de Cierre. Debajo Sí Listan Varios Tipos de Elementos de Marcado Usados en HTML.

Estructura General De Una línea de Código en el Lenguaje de ETIQUETAS HTML.

El Marcado Estructural describir el Propósito del Texto. EJEMPLO Por, <h2> Golf </ h2> Establece «Golf» Como Un encabezamiento de Segundo Nivel, el Cual Sí mostraría En Un Navegador De Una Manera parecida al título «Marcado HTML» al Principio de this section. El Marcado Estructural Pecado Definir del SE de Como Verá el Elemento, Pero la Mayoría de los Navegador web de de de han estandarizado EL FORMATO De Los Elementos. Florerias del Pecado del aplicarse Formato específico al Texto Por Medio de Hojas de Estilo en Cascada .

El Marcado presentacional describe la apariencia del Texto, Importar Pecado HACER Función. EJEMPLO Por,  negrita  Que indica los Navegadores web visuales Deben mostrar el text in negrita , Pero no indica QUÉ HACER Deben los Navegadores Web Que muestran el Contenido de Otra Manera (EJEMPLO POR, leen Los Que el Texto en Voz Alta). En el Caso de  negrita  e  itálica  , existencial Elementos Que se ven de la Misma Manera Pero Tienen Una Naturaleza Más semántica:  Énfasis Fuerte  y  Énfasis  . Es Fácil ver Como Un Lector de Pantalla deberia Interpretar ESTOS DOS Elementos. Sin embargo, El Hijo equivalentes Una suspensión correspondientes Elementos presentacionales: un lector de Pantalla no deberia Decir Más Fuerte el Nombre de la ONU Libro, aunque ESTE Esté en itálicas En Una Pantalla. La Mayoría del Marcado presentacional ha Sido desechada Con HTML 4.0, en favor de Hojas de Estilo en Cascada.

El Marcado hipertextual Sí utiliza Parr enlazar contradictorio del document estafa Otro es en en documentos o estafa Otras contradictorio del document Mismo. Enlace CREAR PARA UN es necessary utilizar la Etiqueta de ancla <a> junto Con El ATRIBUTO href , Que establecerá la Dirección URL de la ONU La Que Apunta el enlace. EJEMPLO Por, El Pecado enlace Que muestre el Texto de la Dirección y de Nuestro Vaya HACIA Wikipedia Servicio podria de forma <a href="http://www.wikipedia.org"> http://www.wikipedia.org </ a> . Also pueden sì CREAR ENLACES SOBRE Otros Objetos, cuentos de Como Imágenes <a href="enlace"> <img src="imagen" /> </ a> .

tutorial html

lunes, 17 de marzo de 2014

Videos HTML

Que es HTML

Ejercicios

Ejemplo de imagen de fondo

Sus elementos

Elementos