Ha azt szeretnéd, hogy a lapodon az egyes linkekhez 1-1 megfelelő ikon társuljon (pl. PDF-re mutató linkhez egy kis PDF ikon kerüljön), használd az alábbi kódot
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style type="text/css"> p {font: normal 1em/1.2em tahoma;} /* all A tags whose HREF attribute ends in .pdf */ a[href$='.pdf'] { padding-left: 18px; background: transparent url(pdf.gif) no-repeat center left; } /* all A tags whose REL attribute = pdf */ a[rel='pdf'] { padding-left: 18px; background: transparent url(pdf.gif) no-repeat center left; } /* all A tags whose REL attributes has the string pdf inside */ a[rel*='pdf'] { padding-left: 18px; background: transparent url(pdf.gif) no-repeat center left; } /* all A tags whose HREF attribute starts with mailto: */ a[href ^="mailto:"] { padding-left: 18px; background: transparent url(mailto.gif) no-repeat center left; } /* all A tags whose CLASS attribute is popup */ a[class ="popup"] { padding-left: 18px; background: transparent url(popup.gif) no-repeat center left; } a[href$='.doc'] { padding-left: 18px; background: transparent url(doc.gif) no-repeat center left; } a[href$='.xls'] { padding-left: 18px; background: transparent url(xls.gif) no-repeat center left; } a[rel ~='external'] { padding-left: 18px; background: transparent url(external.gif) no-repeat center left; } </style> </head> <body> <p><a href="mailto:x@x.com">email</a></p> <p><a class="popup" href="#">pop up</a></p> <p><a href="test.doc">word</a> </p> <p><a href="test.xls">excel</a></p> <p><a rel="external" href="http://www.test.com">website</a></p> <p><a href="test.pdf">pdf</a></p> <p><a rel="pdf" href="test">pdf2</a></p> <p><a rel="xxpdfxx" href="test">pdf3</a></p> </body> </html> |
