Icone e css per i doc

Doc pdfUno strumento importante oggi: un css abbinato a icone dei programmi più usati per visualizzare o scaricare allegati, da word a excel, etc attraverso il quale si attribuisce in modo automatico a link che presentano certe caratteristiche, le icone citate.

Esempio:

Vogliamo che di fianco ad ogni link dei file pdf compaia l’iconcina relativa?

Ecco come si fa:

a[href$=’.pdf’] {
    padding: 5px 20px 5px 0;
    background: transparent url(icons/icon_pdf.gif) no-repeat center right;
}

come vedete si fa ricorso ad uso avanzato di definizioni di tags. In questo caso stiamo dicendo al css che ogni link che abbia come href un qualsiasi testo contenente .pdf deve avere quelle caratteristiche (l’iconcina relativa come background).

Carino vero? E soprattutto utile perchè già impostato per le maggiori applicazioni del web.

Unica pecca: non funziona su ie6 (ovviamente :S)

Ecco il link dove scaricare css e icone: Iconize textlinks with css

lauryn

Web designer dal 2002, mi occupo di content marketing per la società WordSteps SLT LTD di Edimburgo e altri clienti. Vivo a Milano, sposata con una figlia e due cagnoline, e una passione per libri e Scozia.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Scarica lo starter kit del professionista
Iscrivendoti alla newsletter mensile riceverai la checklist pdf alla tua casella email
Guide to Million Dollar Success
My Website
Per chi inizia a muoversi nel web
Scarica lo starter kit del professionista
Iscrivendoti alla newsletter riceverai la guida in pdf direttamente al tuo indirizzo email.
My Website
Per chi inizia a muoversi nel web
%d blogger hanno fatto clic su Mi Piace per questo: