Tengo una lista ordenada para la que necesito establecer los # valores. Algo así como:Establecer los valores de la etiqueta LI en HTML
<ol>
<li ShowValue=34>apple</li>
<li ShowValue=45>pear</li>
<li ShowValue=55>car</li>
</ol>
Para que se muestran con los números que asignar
34.apple
45.pear
55.car
¿Hay una manera de contar el número de LI lo que se debe mostrar?
Si utiliza HTML 4.01 usted puede hacer esto:
<ol>
<li value="34">apple</li>
...
</ol>
aviso Bu que this is deprecated.
¿Qué tal tomar una lista desordenada y escribir el número dentro?
<ul>
<li>34. apple</li>
<li>45. pear</li>
<li>55. car</li>
</ul>
Tendría que ocultar las viñetas de la lista a continuación. Utilice
ul {
list-style-type: none;
}
para eso.
Depende de cómo se genera el HTML. Si es estática, entonces simplemente escribiendo los valores en que funcionaría:
<li value="35">35.apple</li>
Si se genera en el servidor, a continuación, puede añadirlo en el código del servidor.
La tercera forma sería utilizar jQuery para modificar el contenido después de que se haya procesado.
Esto generaría '35. 35.apple'. –
No puede alterar el contenido de un marcador de lista generado automáticamente desde JavaScript ... tendría que ocultar el marcador por completo y poner el número en el contenido principal, como en la respuesta de Alex. – bobince
El enfoque HTML:
<ol start="34">
<li>apple</li>
<li>pear</li>
<li>car</li>
</ol>
esto está en desuso en HTML 4 a favor de la CSS contenido generado:
<style type="text/css">
.mylist { counter-reset: mycounter 34; }
.mylist li { counter-increment: mycounter; list-style-type: none; }
.mylist li:before { content: counter(mycounter) ". "; }
</style>
<ol class="mylist">
<li>apple</li> ...
</ol>
Esto tiene algunas ventajas, ya que también se puede dejar que una lista de ejecución a través sin restablecer (para si tiene otras 33 cosas en una lista anterior). Sin embargo, no funciona en IE6/IE7 por lo que puede olvidarse por el momento.
La desaprobación de <ol start> (y <li value>) es motivo de controversia. Muchos (yo incluido) creen que fue un error, ya que el número de la lista está más cerca del contenido que la presentación en el caso común de una lista continua. Si bien el truco de HTML es desagradable, la solución de CSS es peor.
De todos modos, HTML5 vuelve a incluir estos atributos para que no desaparezcan. Si continúa siendo <ol> s, me quedaré con los atributos HTML start/value, y usar HTML4/XHTML1 Transitional DOCTYPE o HTML5.
Para su información, esta opción es una solución PERFECTA cuando realiza publicaciones en línea en editores que tienen "compatibilidad limitada con HTML". – Jaxidian
No utilice un atributo para generar un valor numérico. Eso no es para lo que son los elementos de la lista y al usarlo de esta manera está violando la semántica de los elementos. El elemento ol es una lista ordenada. Eso significa que los elementos de la lista tienen un valor de metadatos enumerado que representa un orden opuesto a una lista desordenada, que no tiene enumeración de metadatos, y por lo tanto es simplemente una colección de elementos de lista sin tener en cuenta la posición de un elemento de lista relativo a los otros artículos de la lista.
Lo que está intentando es una función de presentación. HTML no es un lenguaje de presentación. El uso debe utilizar CSS:
#custom-item:before {
content: "35.";
}
Consulte este artículo para obtener más información: http://www.alistapart.com/articles/taminglists/
Pero [sin depreciación en HTML5] (http://dev.w3.org/html5/spec/single-page.html#attr-li-value) –
Pero el 'valor' de un' li' no es el lo mismo que el valor de un campo de formulario. "El atributo' value', si está presente, debe ser un _valid integer_ dando el _ordinal value_ del elemento de la lista. " – Homer