Listas de numeración ordenadas con números romanos

By: Iván Dangerfielden martes, febrero 18, 2014
Para éste nuevo tutorial os voy a enseñar en está entrada, para aquellas personas que no lo sepan, de cómo cambiar la lista numerada que está por defecto en Blogger, por otra lista numerada con números romanos, es muy sencillo de implantar y de adaptar en la plataforma Blogger. Pero antes de adaptarlo en tu blog, cómo siempre puedes ver la demostración en el siguiente botón azulado, sólo haz click, para ver la demostración en vivo y en directo, enjoy!
Demo Romans Numbers!
Añade el código CSS en tu plantilla antes de ]]></b:skin>

#listaromana { 
font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Lucida, Geneva, Helvetica, sans-serif !important; /* Tipo de fuente */ 
}
#listaromana ol { 
 list-style-type: upper-roman; /* Tipo de lista ordenada */
 color:#eee; /* Color de la fuente */
 font-size:14px; /* Tamaño de la fuente */
 list-style-position: inside !important; 
}
#listaromana ol li { }

Añadir la lista numerada romana agregando el HTML

<div id="listaromana">
   <ol>
      <li>Lorem ipsum dolor sit amet, ...<br />Fusce sit amet ...</li>
      <li>Aenean placerat lectus tristique...<br />Vivamus interdum ...</li>
      <li>Mauris eget sapien arcu, vitae...<br />Phasellus neque risus...</li>
      <li>Phasellus feugiat lacus ...<br />Duis rhoncus ...</li>
   </ol>
</div>

Por último, puedes cambiar el tipo de lista en el código CSS, en éste caso, es una lista numerada romana, pero puedes cambiarla, buscando en el código CSS, cómo he mencionado anteriormente, esto: list-style-type: upper-roman; (tipo de lista ordenada). Una vez localizado dicho CSS, remplaza upper-roman por: list-style-type:circle; (lista con circulos), list-style-type:square; (lista con cuadrados), list-style-type:lower-alpha; (lista del alfabeto).

Get free premium widgets for your blog and website.