jueves, 21 de abril de 2016

Html5 - 15. Atributo Start y reversed en listas

Expongo en esta entrada el atributo "start" con el que podemos indicar que una lista empieze a numerarse desde el numero indicado con este atributo.
Para ver un ejemplo, retomamos la plantilla web que hemos creado en los apartados anteriores, modificando el "article" principal:

<!DOCTYPE html>
<html>

<head>
<meta charset='utf-8'>
<link rel="stylesheet" href="hojadeestilo.css">
<title>Atributo start / reversed</title>
</head>
<body>
<header>
<h1>Start y reversed en listas</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>
<h2>Lista desde el principio</h2>
    <ol>
      <li>Uno</li>
      <li>Dos</li>
      <li>Tres</li>
    </ol>

<h2>Lista desde el numero cinco</h2> 
  <ol start="5">
      <li>Uno</li>
      <li>Dos</li>
      <li>Tres</li>
    </ol>

<h2>Lista numerada al reves</h2> 
  <ol reversed>
      <li>Uno</li>
      <li>Dos</li>
      <li>Tres</li>
    </ol>

</section>

<aside>
<h1>Siguenos en:</h1>
<ul>
<li><a href="facebook.html">Facebook</a>
</li>
<li><a href="twitter.html">Twitter</a></li>
</ul>
</aside>
<footer>

<p>Pagina creada por Ticoticotaa @2016</p>

<ul>
<li><a href="contacto.html">Contacto</a>
</li>
<li><a href="mapaweb.html">Mapa Web</a></li>
</ul>
</footer>
</body>
</html>
Incluyo 2 listas una sin el atributo start y la otra con el valor de start = 5, por lo que esta segunda lista se empieza a numerar desde 5.
El atributo "reversed" hace que la lista se numere al reves, de mayor a menor, puede combinarse con "start".
Esperando sea util, gracias.

No hay comentarios:

Publicar un comentario