Lista ordenada a dos niveles
Estoy realizando el diseño de un documento que incluye un Indice de contenidos, el cual quisiera realizarlo mediante CSS pero me encuentro con la dificultad de personalizar las listas de segundo nivel como 2.1. O 3.1. Ya que la etiqueta <ol> solamente muestra 1. O 2.
Si pudiera ayudarme con esta inmensa inquietud, y si es posible ayudarme con algún enlace o ejemplos con varios niveles tipo 3.1.1. O 4.3.1 le anticipo mis agradecimiento
Si pudiera ayudarme con esta inmensa inquietud, y si es posible ayudarme con algún enlace o ejemplos con varios niveles tipo 3.1.1. O 4.3.1 le anticipo mis agradecimiento
2 Respuestas
Respuesta de zegga
Lo que podría recomendarte si deseas hacerlo con listas automáticas es usar literales para los nodos hijos, similar al ejemplo siguiente
<OL>
<LI>Lista 1
<ol start="a">
<LI>Lista 1.1</LI>
<LI>Lista 1.2</LI>
<LI>Lista 1.2</LI>
</ol>
</LI>
<LI>Lista 2</LI>
</OL>
Si no puedes hacerlo usando paddings o margin y haciend las listas manualmente. ejemplo:
<style>
<!--
li.mainSt,li.main1lv, li.main2lv {
list-style: none;
list-style-type: none;
list-style-image: none;
}
li.main1lv {margin-left: 15px;}
li.main2lv {margin-left: 35px;}
-->
</style>
<li class="mainSt">1. Lista 1</li>
<li class="main1lv">1.1 Lista 1</li>
<li class="main2lv">1.1.2 Lista 1</li>
<li class="main2lv">1.1.2 Lista 1</li>
<li class="main1lv">1.2 Lista 1</li>
<li class="main1lv">1.3 Lista 1</li>
<li class="mainSt">2. Lista 1</li>
<li class="mainSt">3. Lista 1</li>
<OL>
<LI>Lista 1
<ol start="a">
<LI>Lista 1.1</LI>
<LI>Lista 1.2</LI>
<LI>Lista 1.2</LI>
</ol>
</LI>
<LI>Lista 2</LI>
</OL>
Si no puedes hacerlo usando paddings o margin y haciend las listas manualmente. ejemplo:
<style>
<!--
li.mainSt,li.main1lv, li.main2lv {
list-style: none;
list-style-type: none;
list-style-image: none;
}
li.main1lv {margin-left: 15px;}
li.main2lv {margin-left: 35px;}
-->
</style>
<li class="mainSt">1. Lista 1</li>
<li class="main1lv">1.1 Lista 1</li>
<li class="main2lv">1.1.2 Lista 1</li>
<li class="main2lv">1.1.2 Lista 1</li>
<li class="main1lv">1.2 Lista 1</li>
<li class="main1lv">1.3 Lista 1</li>
<li class="mainSt">2. Lista 1</li>
<li class="mainSt">3. Lista 1</li>
Respuesta de tnathos
-1
Mmmm lo que pasa es que esas listas tienen un numero limitado de items.. podrías usar hasta para y darle un estilo a cada uno