CSS -Anwendung: Zeigen Sie verschiedene Symbole entsprechend dem Dateityp an

Manchmal bietet unser Blog oft einige Ressourcen für andere zum Herunterladen, aber in PJBlog werden alle Download -Links nur durch ein Symbol dargestellt. Mit dem neuen CSS3 -Attribut -Selektor, dieser neuen Technologie, können wir verschiedene Symbole gemäß den verschiedenen Arten von heruntergeladenen Dateien anzeigen.

Was wir hier verwenden wollen, ist
E [att $ = value] {…}

Seine Bedeutung wird verwendet, um alle Elemente E auszuwählen, die mit einem Wert enden. Dann können wir so schreiben:
a [href $ = '. torrent'] {
Polsterung: 5px 20px 5px 0;
Hintergrund: transparente URL (icons/icon_torrent.gif) No-Repeat Center Right;
}
a [href $ = '. vcard'] {
Polsterung: 5px 20px 5px 0;
Hintergrund: transparente URL (icons/icon_vcard.gif) No-Repeat Center Right;
}
a [href $ = '. exe'] {
Polsterung: 5px 20px 5px 0;
Hintergrund: transparente URL (icons/icon_exe.gif) No-Repeat Center Right;
}
a [href $ = '. dmg'], a [href $ = '. App'] {
Polsterung: 5px 20px 5px 0;
Hintergrund: transparente URL (icons/icon_dmg.gif) No-Repeat Center Right;
}