martes, 20 de octubre de 2015

Html5, primer texto

Dentro de las etiquetas <head> y <body> de html5 hay una gran cantidad de opciones segun que es lo que queramos que ponga, primero os pondre un ejemplo y como quedaria, y despues os explicare que hace cada etiqueta
<!DOCTYPE html>
<html>
<head>
<title> Las fiestas del pilar </title>
</head>
<body>
<h1>Día 1</h1>
<h2>Día 2</h2<h3>Día 3</
<h4>Día 4</h4>
<h5>Día 5</h5>
<h6>Día 6</h6>

<p>El ayuntamiento de aragon os desea diversión</p>
<hr/>
<em>para mas informacion</em>
<mark>999 99 99 99</mark>
<hr/>
<p>grado de diversión</p>
<meter value="2" min="0" max="10"></meter>
</body>
</html>

y quedaria:





 Bien, comenzamos con la explicacion línea a línea
Línea 1 es la etiqueta que hace que nuestro texto lo entiendan los nevegadores
Línea 2 comienzo del documento html
Línea 3 comienzo de la cabezera
Línea 4 etiqueta <title> es la que hace que en la pestaña del navegador ponga Las fiestas del pilar como se ve en la imagen, </title> cierra el titulo
Línea 5 final de la cabecera
Línea 6 principio del cuerpo
Línea 7 etiqueta <h1> indica que quieres escribir con la letra mas grande, se suele usar para titulos, para letras mas pequeñas aumentamos el numero de la h hasta un maximo de 6, de esa forma las siguientes letras son cada vez un poco mas pequeñas, estas etiquetas se terminan tambien con </h1> variando el numero de letra correspondiente
..................
Línea 13 la etiqueta <p> y </p> quiere decir que lo que escribas entre ellas se escribira como texto normal
Línea 14 La etiqueta <hr/> es una etiqueta que se abre y cierra en el mismo sitio, seria lo mismo poner <hr></hr> sin poner nada entre ellas, por lo que poniendo <hr/> te ahorras espacio con cualquier etiqueta y no quieras poner nada en medio, esta concretamente crea una linea hasta el final de la pantalla
Línea 15 La etiqueta <em> es una etiqueta parecida a <p>, solo que esta etiqueta sirve para que se escriba en cursiva (si lo quisieramos en negrita es <b>
Línea 16 Esta nueva etiqueta es bastante util, <mark> sirve para resaltar texto importante como el numero de telefono inventado en el ejemplo de arriba
Línea 17 Otra linea
......
Línea 19 Esta etiqueta, que se usa mucho, sirve para crear una barra con el valor que tu quieras, se escribe de la siguiente manera <meter value="2" (el valor que quieres que represente) min="0" (el valor minimo) max="10"(el valor maximo)></meter> (cierre de meter) de forma que si quieres una barra con un 80%
<meter value="8" min="0" max="10"></meter>
o
<meter value="80" min="0" max="100"></meter>
 o cualquier convinación que se te ocurra
 Las dos ultimas líneas cerramos body y cerramos html



Un saludo, espero que os vaya gustando el ritmo de aprendizaje y cualquier duda, dejadla en los comentarios, para comprobar si veuestro texto html5 es correcto, guardad el notepad como lo que sea.html y despues abridlo con cualquier navegador

No hay comentarios:

Publicar un comentario