Programacion leccion
MisterMiisssteri5 de Noviembre de 2013
3.388 Palabras (14 Páginas)209 Visitas
LECCIÓN 1
Sólo sigue las instrucciones. Abre el Bloc de notas e inicia con esto...
<html>
</html>
Cada página debe comenzar y terminar con la etiqueta (tag) HTML. Una etiqueta se cierra agregando /. La mayoría de las etiquetas tienen una etiqueta de terminación. Con las etiquetas se dan instrucciones a los navegadores. Lo que se acaba de decir al navegador es "este es el inicio de un documento HTML" (<html>) y "este es el final del documento HTML" (</html>). Ahora necesitamos colocar información entre estas etiquetas.
________________________________________
Todo documento HTML requiere un par de "etiquetas de encabezado"
<html>
<head>
</head>
</html>
________________________________________
Por el momento contemplaremos la etiqueta "Título" (title) dentro de las "etiquetas de encabezado" (head)
<html>
<head>
<title></title>
</head>
</html>
________________________________________
El resto del documento aparecerá dentro de las etiquetas "BODY"
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
________________________________________
¡UPPPSSS! Casi lo olvido, coloca un título para tu página
<html>
<head>
<title>Mi primera página</title>
</head>
<body>
</body>
</html>
________________________________________
Ahora guarda tu página, no como un archivo txt, sino como un documento html. Guárdala como pagina1.html Si no sabes cómo hacer ésto, lee lo siguiente:
1. Selecciona "Guardar como" en el bloc de notas
2. Elige el directorio en que guardarás el archivo.
3. En donde dice "Guardar como archivos de tipo" selecciona "Todos los archivos (*.*)"
4. En "Nombre de archivo" anota pagina1.html
5. Clic en "Guardar" y... listo... ¡has creado tu primera página!
Desafortunadamente, por ahora tu página no contiene nada, sólo se muestra el título de la misma en la parte superior del navegador. Así que la siguiente tarea es agregar algo en tu página.
La mejor forma de seguir las lecciones es abriendo una pestaña (ventana) adicional para que en ella visualices tu trabajo, mientras lees esta ventana y trabajas con el bloc de notas.
Para abrir una nueva pestaña (ventana) debes hacer lo siguiente:
1. Selecciona el menú "Archivo" (File)
2. Ahora "Nueva pestaña" (New Tab)
3. Si estás usando Internet Explorer y Firefox, puedes abrirla más rápido si presionas CTRL + T.
LECCIÓN 2
Para evitar escribir varias veces lo mismo, me enfocaré a la etiqueta "BODY" para incluir el contenido de la página.
<body>
</body>
________________________________________
Anota: "Lo que más se te antoje"
<body>
Lo que más se te antoje
</body>
Cada vez que agregues algo nuevo, salva tu documento, después, dá clic en el botón "Reload"(Actualizar) del navegador (supongo que tienes abierto tu documento en la pestaña (ventana) adicional de la lección anterior). Si no se muestran tus cambios actuales, al momento de dar clic en el botón Reload mantén presionada la tecla "Shift"
________________________________________
Lo primero que debes aprender es a cambiar los colores del fondo.
<body bgcolor="#ffffff">
Lo que más se te antoje
</body>
* bgcolor="#ffffff" (background="blanco") es el código del color blanco.
________________________________________
Se puede especificar una imagen para colocarla como fondo en lugar de un color sólido.
<body background="background4.jpg">
Lo que más se te antoje
</body>
Esta es la imagen del fondo que he empleado:
________________________________________
Para observar la forma en que se muestra la imagen usándola como fondo, haz click sobre la misma.
________________________________________
Es obvio que la imagen se coloca en forma de mosaico para cubrir toda la página. Pero si creas una imagen larga puedes obtener un efecto similar al que se muestra a continuación...
<body background="fondo.jpg">
Lo que más se te antoje
</body>
Haz clic aquí para ver esta forma de fondo.
Esta es la imagen que uso para ese fondo.
(su tamaño real es 1200x15 pixeles, pero la reduje a 400x15 pixeles para que se vea en cualquier resolución de pantalla)
________________________________________
Regresemos a la pantalla blanca
<body bgcolor="#ffffff">
Lo que más se te antoje
</body>
Coloquemos algo en Negritas
<body bgcolor="#ffffff">
Lo que más se te <strong>antoje</strong>
</body>
Lo que se dice al navegador es: en <strong> comenzar con negritas, y en </strong> detener las negritas.
________________________________________
Lo mismo aplica para las itálicas
<body bgcolor="#ffffff">
Lo que mas <EM>se te</EM> antoje
</body>
________________________________________
... y también para el subrayado
<body bgcolor="#ffffff">
<U>Lo que más</U> se te antoje
</body>
________________________________________
Regresemos nuevamente a pantalla blanca sin formato en palabras...
<body bgcolor="#ffffff"> (bgcolor puedes colocarlo en mayúsculas )
Lo que mas se te antoje
</body>
________________________________________
Se puede usar una combinación de etiquetas si se desea.
<body bgcolor="#ffffff">
Lo que más se te <i><strong> antoje</strong></i>
</body>
Este es un ejemplo de etiquetas combinadas. Si vas a usar etiquetas combinadas (lo que harás dentro de poco), entonces debes evitar confundir al navegador, las etiquetas deben ser combinadas no sobre puestas. Déjame explicarte lo que trato de decir...
<esto><aquello> </esto></aquello> Etiquetas sobre puestas... mal
<esto><aquello></aquello> </esto> Etiquetas combinadas... bien
________________________________________
Puedes cambiar el tamaño de las letras... es muy sencillo
Primero agrega las etiquetas de fuente
<body bgcolor="#ffffff">
Lo que más se te <font>antoje</font>
</body>
Después aplica el tamaño
<body bgcolor="#ffffff">
Lo que más se te <font size="6">antoje</font>
</body>
Existen 7 tamaños de fuente
1 2 3 4 5 6 7
Dos aspectos importantes que deben tenerse en cuenta...
1. Una <ETIQUETA> le dice al navegador que haga algo. Un "ATRIBUTO" va dentro de la<ETIQUETA> y le indica al navegador "cómo" hacerlo.
2. El "VALOR POR DEFECTO" empleado por los navegadores se aplica cuando no se indica nada al respecto. Por ejemplo, el tamaño por defecto de las fuentes en los navegadores es 3. A menos que se establezca uno distinto seguirá siendo 3.
El valor por defecto en los navegadores (no todos) es Times New Roman 12 pt (lo cual representa el número 3 con el cógido de html) en color negro. Intenta colocar la fuente como Arial o Comic Sans...
<body bgcolor="#ffffff">
Lo que más se te <font face="arial">antoje</font>
</body>
Sin embargo, no se recomienda emplear la etiqueta FACE debido a que se requiere tener la fuente en la pc para poder visualizarla. Me explico, si tú tienes la fuente "XYZ" en tu pc y la colocas en tu página web, la podrás ver sin problemas, pero cuando un visitante llega y no tiene la fuente, no podrá ver ese tipo de letra que colocaste y será suplantada por la fuente por defecto de su sistema.
Se puede usar una combinación de fuentes que pueden resolver este problema, tal como en<FONT FACE="ARIAL, HELVETICA, LUCIDA SANS">Quiero aprender HTML</FONT>.
Para
...