lunes, 18 de enero de 2016

Html5 - 4. Section + Article

En esta entrada explico las etiquetas "section" y "article".
La etiqueta "section" puede englobar una o varias etiqutas "article", se trata de la parte principal, la que lleva el contenido esencial de la pagina web que estamos creando.
El codigo del que partimos es el siguiente:
<!DOCTYPE html><html>
<head>
<title>Mi primera Web</title>
</head>
<body>
<header>
<h1>Cabecera de Mi Web</h1>
<figure><img src="milogo.jpeg"/></figure>
</header>

<nav>
<ul>
<li><a href="index.html">Inicio</a></li>
<li><a href="acercade.html">Acerca de</a></li>
</ul>
</nav>
<section>
<article>
<hgroup>
<h1>Aqui va el encabezado grande</h1>
<h2>Aqui un encabezado mas pequeño</h2>
</hgroup>
<p>Aqui ponemos un parrafo que es el contenido de nuestra pagina.</p>

<p>Este puede ser un segundo parrafo de nuestra web.</p></article>
<article>
<hgroup>
<h1>Aqui va el encabezado grande del segundo Article</h1>
<h2>Aqui un encabezado mas pequeño</h2></hgroup>
<p>Aqui ponemos un parrafo que es el contenido de nuestra pagina.</p>

<p>Este puede ser un segundo parrafo de nuestra web.</p></article>
</section>
</body>
</html>
Como podeis observar he introducido 2 article para que se vea bien la forma de usarlos, dentro de cada article he puesto un hgroup que agrupa 2 encabezados o titulos del parrafo, y seguidamente 2 parrafos con la etiqueta "p".
Es autoexplicativo, escribirlo en vuestro software para realizar el archivo html, para practicar y observar como se ve dicho codigo en el navegador que tengais.
Espero sea util, gracias.

No hay comentarios:

Publicar un comentario