Curso HTML El Dog HTML

Curso HTML el Dog html
Empezando
La mayora de las cosas en la web no son diferente de las cosas en tu computadora - es slo una carga completa de
archivos ordenados en una carga completa de directorios.
Los archivos HTML no son ms que simples archivos de texto, por lo que para empezar a escribir en HTML, no necesitas
nada ms que un simple editor de texto.
Notepad es un editor de texto comn en equipos basados en Windows (normalmente encontrado en los Programas>
Accesorios Men) y las computadoras Mac OSX venir incluido con TextEdit pero cualquier programa que te permite
jugar con el texto va a hacer.
Escribe esto en tu editor de texto:
Esta es mi primera pgina web

Ahora cree una carpeta llamada "html" donde ms te guste para guardar archivos en su computadora y guardar el
archivo como "myfirstpage.html".
Ten cuidado. Es importante que no se especifica la extensin ".html" - algunos editores de texto, como
el Bloc de notas, automticamente se guarda como ".txt" en caso contrario.
Usted tambin necesita asegurarse de que el archivo se guarda como texto sin formato. TextEdit, por
ejemplo, se iniciar nuevos archivos como "texto enriquecido", que contiene un montn de extras de
formato, de forma predeterminada. En tales casos, ir a las preferencias y asegrese de comprobar la
opcin de formato "Texto sin formato" antes de crear un nuevo archivo.
Para ver archivos HTML, que ni siquiera tienen que estar en la web. Abra un navegador web como Chrome, Firefox,
Safari o Internet Explorer y en la barra de direcciones, en la que suele escribir direcciones Web, escriba la ubicacin
del archivo que acaba de guardar (por ejemplo, "c: \ html \ myfirstpage.html ") y pulse Enter. Alternativamente, vaya al
men Archivo del navegador, seleccione Abrir y buscar el archivo.
Pow. Ah est. Su primera pgina web. Qu emocionante. Y todo lo que se fue un par de palabras escritas.
Lo hemos dicho aqu para usar un editor de texto bsico, como el Bloc de notas, pero usted puede tener
la tentacin de utilizar un programa de software dedicado, como Adobe Dreamweaver.
Usted debe tener mucho cuidado al usar estos programas, especialmente si usted es un principiante, ya
que a menudo lanzan en cdigo innecesario o no estndar para "ayudarle".
Si usted es serio acerca de aprender HTML, debe leer a travs de un tutorial como este primero, de
modo que por lo menos tener un conocimiento bsico de lo que est pasando.
Los programas de software de este tipo nunca le dar el mismo control sobre una pgina web como la
codificacin a mano.
Si usted decide utilizar un software especializado de edicin de cdigo, se recomienda una en la que
todava se est codificando con la mano. Ellos pueden, de hecho, ser til, especialmente los ms
avanzados a convertirse, en trminos de resaltado de sintaxis de cdigo y gestin de archivos.
Etiquetas, atributos y elementos

Aunque los conceptos bsicos de HTML es texto plano, necesitamos un poco ms para que sea un documento HTML
agradable y brillante.
Etiquetas
La estructura bsica de un documento HTML incluye etiquetas, que rodean contenido y se aplican significado.
Cambie su documento para que se parezca a esto:
<! DOCTYPE html>

<html>
<body>
</ Body>
</ html>
Ahora, guarde el documento de nuevo, volver al navegador web y vuelva a cargar la pgina.
El aspecto de la pgina no han cambiado en absoluto, pero el propsito de HTML es aplicar sentido, no presentacin,
y este ejemplo ha definido algunos elementos fundamentales de una pgina web.
La primera lnea en la parte superior, <!DOCTYPE html> , es una declaracin de tipo de documento y permite
que el navegador sabe qu variante del HTML est utilizando (HTML5, en este caso). Es muy importante mantener
esto en - Si no lo hace, los navegadores asumirn que no se sabe muy bien lo que ests haciendo y actuar de una
manera muy peculiar.
Para volver al punto, <html> es la etiqueta de apertura que se inicia las cosas fuera y le dice al navegador que
todo
lo
que
entre
eso
el </html> etiqueta
de
cierre es
un
documento
HTML. Las
cosas
entre <body> y </body> es el contenido principal del documento que aparecer en la ventana del navegador.
Etiquetas de cierre
El </body> y </html> puso una cerca de sus respectivos elementos (ms sobre elementos en un momento).
No todas las etiquetas tienen etiquetas de cierre como este ( <html> </html> ) algunas etiquetas, que
no envuelven alrededor del contenido cerrarn a s mismos. La etiqueta de salto de lnea, por ejemplo,
se ve as: <br> - un salto de lnea no se sostiene cualquier contenido por lo que la etiqueta se sienta
alegremente por su solitaria auto. Vamos a venir a travs de estos ejemplos ms adelante. Todo lo que
necesitas recordar es que todas las etiquetas de contenido entre ellos deben estar cerradas, en el formato
de la etiqueta de apertura contenido etiqueta de cierre. No, est hablando estrictamente, siempre
es un requisito, pero es una convencin que estamos usando en estos tutoriales, porque es una buena
prctica que se traduce en ms limpio, ms fcil de entender el cdigo.
Usted puede venir a travs de las etiquetas "de cierre automtico", mediante el cual un br etiqueta, por
ejemplo, se ver as " <br /> "en lugar de simplemente" <br> ". Este es un remanente de XHTML, una
forma de HTML basado en otro lenguaje llamado XML. HTML5 es mucho ms relajado que el
XHTML y estar feliz con cualquier formato. Algunos desarrolladores prefieren una manera, algunos
prefieren la otra. Tiramos una moneda y decidimos quedarnos con la versin ms simple.
Atributos
Las etiquetas tambin pueden tener atributos , que son bits adicionales de informacin. Los atributos aparecen
dentro de la etiqueta de apertura y sus valores se sientan dentro de las comillas. Se parecen a <tag atributo =
"valor"> Margarina </ tag> . Vamos a venir a travs de las etiquetas con los atributos ms tarde.
Una vez ms, las comillas no son siempre esenciales pero es una convencin de buena prctica HTML
Perro utiliza para mantener la coherencia y la claridad. Le sugerimos que haga lo mismo.
Elementos
Etiquetas tienden a no hacer mucho ms que marcar el comienzo y el final de un elemento. Los elementos son los bits
que componen las pginas web. Se podra decir, por ejemplo, que todo lo que est en el medio (e incluye)
el <body> y</ body> etiquetas es el elemento del cuerpo. Como otro ejemplo, mientras
" <title> "y" </ title> "son etiquetas " <title> Rumple Stiltskin </ title> "es un elemento de ttulo.
que
Ttulos de pgina
Todas las pginas HTML deben tener una pgina de ttulo .
Para aadir un ttulo a su pgina, cambiar el cdigo para que se parezca a esto:
<! DOCTYPE html >

< html >
< Head >
< ttulo > Mi primera web page </ title >
</ head >
< Body >
Esta es mi Primera Pgina web
</ Body >
</ Html >
Hemos aadido dos nuevos elementos aqu, que comienzan con la cabeza etiqueta y elttulo de la etiqueta (y ver
cmo ambos cerca).
El elemento de cabeza (la que comienza con el <head> etiqueta de apertura y termina con la </ head> etiqueta
de cierre) antes del elemento del cuerpo (a partir de <body> y termina con </ body> ) y contiene
informacin sobre la pgina . La informacin contenida en el elemento de cabeza no aparece en la ventana del
navegador.
Veremos ms adelante que otros elementos pueden aparecer dentro del elemento de cabeza, pero el ms importante
de ellos es el ttulo del elemento.
Si nos fijamos en este documento en el navegador (guardar y recargar como antes), ver que "Mi primera pgina web"
aparecer en una pestaa o la barra de ttulo de la ventana (no el rea real de la lona). El texto que se pone en medio
de las etiquetas de ttulo se ha convertido en el ttulo del documento (sorpresa!). Si se va a aadir esta pgina a sus
"favoritos" (o "marcadores", dependiendo de su navegador), se vera que el ttulo tambin se utiliza all.
Prrafos
Ahora que tiene la estructura bsica de un documento HTML, se puede perder el tiempo con el contenido un poco.
Vuelve a tu editor de texto y aadir otra lnea a su pgina:
<! DOCTYPE html>

< html >
< cabeza >
< ttulo > Mi primera pgina web </ titulo >
</ cabeza >
< cuerpo >
Qu emocionante
</ cuerpo >
</ html >
Mira el documento en su navegador.
Usted podra haber esperado su documento aparezca como las ha escrito, en dos lneas, pero en su lugar debera ver
algo como esto:
Esta es mi primera pgina web Cmo emocionante.

Esto se debe a que los navegadores no suelen hacer caso de lo que se alinea su cdigo est activado. Asimismo, no
tome ningn aviso de espacios (que se obtendra el mismo resultado si escribi "Esta es mi primera pgina web Cmo
emocionante").
Si desea que el texto aparezca en diferentes lneas o, ms bien, si pretende que haya dos bloques distintos de texto
(porque, recuerda, HTML es del significado, no presentacin), tendr que declarar explcitamente que.
Cambie sus dos lneas de contenido para que se vieran como esto:
< p > Esta es mi primera pgina web </ p >

< p > Qu emocionante </ p >
El p etiqueta se utiliza para los prrafos .
Mira los resultados de este. Las dos lneas aparecern ahora en dos lneas debido a que el navegador los reconoce
como prrafos separados.
Piense en el contenido HTML, como si se tratara de un LIBRO
- con los prrafos en su caso.
nfasis
Puede resaltar texto de un prrafo usando em (nfasis) y fuerte (fuerte importancia).
< p > S, eso realmente < em > es </ em > emocionante. < fuerte > Advertencia: </ fuerte > . nivel de
emocin puede causar la cabeza a punto de estallar </ p >
Tradicionalmente, los navegadores muestran em en cursiva y fuerte en negrita de forma

predeterminada, pero no son lo mismo que i y b etiquetas que (a pesar de que se han redefinido
tenuemente en HTML5) tienen su origen en cursiva y negrita - recuerda - HTML no es para la
presentacin. Si desea hacer hincapi en algo visualmente (haciendo algo cursiva, por ejemplo), es casi
seguro que quieres darle nfasis general. Usted no puede hablar en cursiva.
Los saltos de lnea

La etiqueta de salto de lnea tambin se puede utilizar para separar las lneas como esta:
Esta es mi primera pgina web < br >

Qu emocionante
No hay contenido en cuestin para romper lneas lo que no hay etiqueta de cierre.
Podra ser tentador rompe el exceso de uso de lnea y br no debe ser utilizado si dos bloques de texto se
pretende que estn separados entre s (porque si eso es lo que quieres hacer es probable que desee
la p etiqueta).
Encabezamientos
El p etiqueta es slo el comienzo de formato de texto.
Si tiene documentos con autnticos partidas , entonces hay etiquetas HTML diseadas especficamente para ellos.
Estn h1 , h2 , h3 , h4 , h5 y h6 , h1 ser el emperador todopoderoso de las partidas y h6 siendo la plebe bajo.

Cambiar su cdigo a la siguiente:
<! DOCTYPE html >

< html >
< Head >
< Ttulo > Mi Pgina Primera web </ title >
</ Head >
< Body >
< H1 > Mi Pgina Primera web </ h1 >
< H2 > Que es esto </ h2 >
< p > Una Pagina sencilla armar Usando HTML </ p >
< H2 > Por Qu Esto Es </ h2 >
< p > Para Aprender HTML </ p >
</ Body >
</ Html >
Tenga en cuenta que la h1 etiqueta slo se utiliza una vez, ya que el principal rubro de la pgina. h2 a h6 , sin
embargo, se puede utilizar tantas veces como se desee, pero siempre deben ser utilizados con el fin, ya que estaban
destinados. Por ejemplo, un h4 debe ser un sub-encabezamiento de un h3 , que debera ser un sub-encabezamiento
de un h2 .
Listas
Hay tres tipos de lista, listas desordenadas, listas ordenadas y listas de definicin. Vamos a ver los dos primeros
aqu, y listas de definicin en el HTML Intermedio Tutorial .
Listas no ordenadas y listas ordenadas funcionan de la misma manera, excepto que el primero se utiliza para las listas
no secuenciales con elementos de la lista suele ir precedida por las balas y el segundo es para las listas secuenciales,
que normalmente estn representados por nmeros incrementales.
La ul etiqueta se utiliza para definir listas desordenadas y el ol etiqueta se utiliza para definir las listas
ordenadas. Dentro de las listas, el li etiqueta se utiliza para definir cada elemento de la lista.
Cambiar su cdigo a la siguiente:
<! DOCTYPE html>

<Html>
<Head>
<Title> Mi primera pgina web </ title>
</ Head>
<Body>
<H1> Mi primera pgina web </ h1>
<H2> Qu es esto </ h2>
<P> Una pgina sencilla armar usando HTML </ p>
<H2> Por qu esto es </ h2>
<Ul>
<li> Para aprender HTML </ li>
<li> Para mostrar </ li>
<li> Porque me he enamorado con mi equipo y quiero darle un poco de HTML amoroso. </ li>
< / ul>
</ Body>
</ Html>
Si nos fijamos en esto en su navegador, ver una lista con vietas. Basta con cambiar los uletiquetas para ol y ver
que la lista ser numerado.
Las listas tambin pueden ser incluidos en las listas para formar una jerarqua estructurada de elementos.
Reemplace el cdigo lista anterior con lo siguiente:
<Ul>
<Li> Para aprender HTML </ li>
<Li>
Para mostrar
<Ol>
<li> Para mi jefe </ li>
<li> A mis amigos </ li>
<li> Para mi gato </ li>
<li> Para el patito de conversacin en mi cerebro </ li>
</ ol>
</ Li>
<Li> Porque me he enamorado con mi equipo y quiero darle un poco de HTML amoroso. </ Li>
</ Ul>
Et voil. Una lista dentro de una lista. Y usted podra poner otra lista dentro de ese. Y otro dentro de ese. Y as
sucesivamente y as sucesivamente.
Enlaces
Hasta ahora usted ha estado haciendo una pgina web independiente, que est muy bien y bonito, pero lo que hace
de Internet sea tan especial es que todos los enlaces juntos.
La "H" y "T" en "HTML" significan "hipertexto", que bsicamente significa un sistema de texto vinculado.
Un ancla etiqueta ( a ) se utiliza para definir un vnculo, pero tambin hay que aadir algo a la etiqueta de anclaje eldestino del enlace.
Agregue esto a su documento:
<! DOCTYPE html>

<Html>
<Head>
<Title> Mi primera pgina web </ title>
</ Head>
<Body>
<H1> Mi primera pgina web </ h1>
<H2> Qu es esto </ h2>
<P> Una pgina sencilla armar usando HTML </ p>
<H2> Por qu esto es </ h2>
<P> Para aprender HTML </ p>
<H2> Dnde encontrar el tutorial </ h2>
<p> <a href="http://www.htmldog.com"> HTML perro </a> </ p>
</ Body>
</ Html>
El destino del enlace se define en el href atributo de la etiqueta. El enlace puede ser absoluto, como
"http://www.htmldog.com", o puede ser relativa a la pgina actual.
As que si, por ejemplo, que haba otro archivo llamado "flyingmoss.html" en el mismo directorio, la lnea de cdigo,
simplemente sera <a href="flyingmoss.html"> El milagro de musgo en vuelo </a> o algo como este.
Un enlace no tiene que enlazar a otro archivo HTML, se puede enlazar a cualquier archivo en cualquier lugar de la
web.
Un enlace tambin puede enviar un usuario a otra parte de la misma pgina en que estn. Se puede
aadir una Identificacin del atributo a casi cualquier etiqueta, por ejemplo <h2 id = "musgo"> Moss
</ h2> , y luego enlazar con l mediante el uso de algo como esto: <a href="#moss"> Ir a </a>
musgo . Al seleccionar este enlace se desplazar la pgina directamente al elemento con ese ID.
http://htmldog.com/guides/html/beginner/images/

Curso HTML El Dog HTML

Hochgeladen von

Dokumentinformationen

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Curso HTML El Dog HTML

Hochgeladen von

Copyright:

Verfügbare Formate

Curso HTML el Dog html

Esta es mi primera pgina web

Etiquetas, atributos y elementos

<! DOCTYPE html>

<! DOCTYPE html >

Vuelve a tu editor de texto y aadir otra lnea a su pgina:

<! DOCTYPE html>

Esta es mi primera pgina web Cmo emocionante.

< p > Esta es mi primera pgina web </ p >

- con los prrafos en su caso.

Tradicionalmente, los navegadores muestran em en cursiva y fuerte en negrita de forma

Los saltos de lnea

Esta es mi primera pgina web < br >

Estn h1 , h2 , h3 , h4 , h5 y h6 , h1 ser el emperador todopoderoso de las partidas y h6 siendo la plebe bajo.

<! DOCTYPE html >

<! DOCTYPE html>

<! DOCTYPE html>

Das könnte Ihnen auch gefallen