Applicare indice per numerare immagini presenti in una lista

[quiris!]

allora è da 2 giorni che cerco nel web informazioni e vado a spulciare javascript, pseudo e elementi. quello che voglio fare è mettere in elenco puntato usando es. <li>immagini 5 </li> voglio mettere il numerino affianco. il numero riportato sta ad indicare quante immagini ci sono in una griglia a piu pagine che codice devo usare?

[KillerWorm]

per fare questa operazione che codice devo usare?

[Mod]
Occhio, di norma titoli del genere comportano la chiusura della discussione. Come da regolamento di sezione ti invito ad usare dei titoli autoesplicativi. Capisco che, non conoscendo i tecnicismi, possa risultare difficile trovare un titolo adeguato ma, ad ogni modo, è sufficiente l'uso di termini che descrivano in sintesi il problema. Per questa volta sistemo io, ti invito a fare attenzione in futuro, grazie.

Di base è possibile usare un "contatore" CSS; forse hai già letto questa guida su html.it: liste con contatori, pseudo-elementi e generated content

Eventualmente fai sapere se hai già provato ad applicare qualche codice proposto sulle guide e cosa non ti torna esattamente. Posta magari anche il codice a cui sei arrivato, così da capire se, e come, sia possibile intervenire per farlo funzionare come serve a te.

Non mi è chiaro cosa intendi per "griglia a più pagine". Tieni presente che il contatore CSS può essere usato per mostrare un indice che viene incrementato in base al relativo elemento identificato attraverso un selettore CSS; chiaramente gli elementi selezionati dovranno essere presenti in una pagina; bisogna capire cosa intendi tu per "più pagine".

Magari spiega meglio con qualche esempio, se possibile.

[quiris!]

Ciao grazie per l'aiuto ma il link che hai postato lo già visto .per griglia intendo https://www.html.it/pag/45422/layout...ap-la-griglia/
Per pagine intendo il file creato in HTML es. Index.html

[quiris!]

Specifico che tra l'elenco che ho creato affiancato ci deve essere un numero che sta ad indicare quante immagini o inannunci ho messo. Spero di essermi spiegato meglio. Ciao grazie per l'aiuto

[quiris!]

.container{
counter-reset: cont;
}

.counted::before{
counter-increment: cont;
content: counter( cont );
}
Credo che questo codice vadi bene ma non so modificarlo ?credo che così comé si possa combinare la griglia ad un elenco così da ottenere la somma di quanti articolo ho inserito

[quiris!]

io penso di aver capito che devo associare uno di questi elementi
ora posto una parte di codice mia:

 <divclass="container">        <div class="row">
          <div class="col-md-4">
            <div class="thumbnail clearfix">
              <span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/5.jpg"  alt="..."></span>
              <div class="caption">
                <h3>La luna</h3>
                <p>
                  La luna geme sui fondali del mare,
                  o Dio morta paura
                  di queste siepi terrene,
                  o quanti sguardi attoniti
                  che salgono dal buio
                  a ghermirti nell'anima ferita.
                </p>
                <p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
                <p> <a href="" class="btn btn-primary">dettagli</a></p>
                </div>
            </div>
          </div>
          <div class="col-md-4">
            <div class="thumbnail clearfix">
              <span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/5.jpg"  alt="..."></span>
              <div class="caption">
                <h3>La luna</h3>
                <p>
                  La luna geme sui fondali del mare,
                  o Dio morta paura
                  di queste siepi terrene,
                  o quanti sguardi attoniti
                  che salgono dal buio
                  a ghermirti nell'anima ferita.
                </p>
                <p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
                <p> <a href="#" class="btn btn-primary">dettagli</a></p>
                </div>
            </div>
          </div>
          <div class="col-md-4">
            <div class="thumbnail clearfix">
              <span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/6.jpg" alt="..."></span>
              <div class="caption">
                <h3>La luna</h3>
                <p>
                  La luna geme sui fondali del mare,
                  o Dio morta paura
                  di queste siepi terrene,
                  o quanti sguardi attoniti
                  che salgono dal buio
                  a ghermirti nell'anima ferita.
                </p>
                <p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
                <p> <a href="#" class="btn btn-primary">dettagli</a></p>
                </div>
            </div>
          </div> 
        </div>

[quiris!]

io penso di aver capito che devo associare uno di questi elementi
ora posto una parte di codice mia:
<divclass="container"> <div class="row">
<div class="col-md-4">
<div class="thumbnail clearfix">
<span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/5.jpg" alt="..."></span>
<div class="caption">
<h3>La luna</h3>
<p>
La luna geme sui fondali del mare,
o Dio morta paura
di queste siepi terrene,
o quanti sguardi attoniti
che salgono dal buio
a ghermirti nell'anima ferita.
</p>
<p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
<p> <a href="" class="btn btn-primary">dettagli</a></p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="thumbnail clearfix">
<span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/5.jpg" alt="..."></span>
<div class="caption">
<h3>La luna</h3>
<p>
La luna geme sui fondali del mare,
o Dio morta paura
di queste siepi terrene,
o quanti sguardi attoniti
che salgono dal buio
a ghermirti nell'anima ferita.
</p>
<p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
<p> <a href="#" class="btn btn-primary">dettagli</a></p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="thumbnail clearfix">
<span class="img-responsive"><img class="flex" src="https://ilbotteghino.altervista.org/bootstrap/immagini/6.jpg" alt="..."></span>
<div class="caption">
<h3>La luna</h3>
<p>
La luna geme sui fondali del mare,
o Dio morta paura
di queste siepi terrene,
o quanti sguardi attoniti
che salgono dal buio
a ghermirti nell'anima ferita.
</p>
<p> <a href="galleria.html" class="btn btn-primary">altre immagini</a></p>
<p> <a href="#" class="btn btn-primary">dettagli</a></p>
</div>
</div>
</div>
</div>

[quiris!]

con questa altra parte di codice
<div class="col-sm-4"onkeyup="onkey()">
<h3>tab1</h3>
<li><a href="">Angoliere<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Armadi<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Cassapanche<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Colonne<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Comò<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Comodini<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Consolles<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Credenze<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Divani<span class="ui-li-count"> 0 </span></a></li>
<li><a href="">Inginocchiatoi<span class="ui-li-count"> 0 </span></a></li>
</div>

[quiris!]

si ora non guardare lo span era una prova ma non va bene

[KillerWorm]

Come ho già accennato, il contatore CSS funziona solo con elementi che già sono presenti nella pagina stessa. Se ho capito bene tu vuoi applicare un numero che fa riferimento agli elementi (immagini, annunci o quel che è) che è possibile consultare accedendo attraverso i link di un elenco. In tal caso ho l'impressione che il solo CSS non sia sufficiente.

Quel numero dovrai andare a pescarlo in qualche altro modo a seconda di come hai strutturato l'intero progetto.

Non mi è chiaro se questi elementi li gestisci dinamicamente attraverso una qualche piattaforma; in tal caso presumo si possano usare delle API per recuperare tali dati che magari visualizzi a dovere con un po' di CSS.

Cerca magari di chiarire meglio il contesto; eventualmente sposto la discussione nella sezione più opportuna se sarà necessario.