Copiare un selettore CSS con Copy Css Selector

Scarica e installa l'estensione del browser:

https://chrome.google.com/webstore/detail/copy-css-selector/kemkenbgbgodoglfkkejbdcpojnodnkg/related?hl=it

(copia il link qui sopra e incollalo nella barra degli indirizzi di una nuova scheda)

Su qualsiasi pagina web, fai clic con il tasto destro sull'elemento che ti interessa. Nel menu vedrai una voce come questa:

Comparirà la voce "Copy Css Selector"

Selezionala: negli appunti verrà copiato il selettore CSS, l'ID o la classe dell'elemento su cui vuoi fare clic nella pagina.

Esempio 1:

a > span.ya-share2__badge > span

Qui l'elemento utile è la classe ya-share2__badge . Le classi CSS si indicano con un punto iniziale, quindi il selettore da usare è:

.ya-share2__badge

Esempio 2:

div#surfingbird-block div:nth-child(2)

Qui invece il riferimento è l'ID surfingbird-block . Gli ID si indicano con # all'inizio, perciò usa:

#surfingbird-block

Esempio 3:

li#thread-share-bar span.thread-share__button.share-facebook > span.share-text

In questo esempio il riferimento più preciso è la classe share-text , scritta con il punto iniziale. Di solito conviene prendere il selettore più a destra; se non basta, puoi risalire anche alla classe  thread-share__button.share-facebook  o all'ID  thread-share-bar. Il selettore finale è:

.share-text