Advanced Search

Return to Snippet

Revision: 30067
at August 6, 2010 22:15 by xavsio4
Initial Code 
The first list item uses the general attribute selector to look for any tags with an accesskey attribute and display an icon to alert users to its presence:

#test_selectors a[accesskey] {
background: url('icon_key.gif') no-repeat 0 50%;
text-indent: 20px;
}

The second item looks for links with a type attribute value of ‘application/pdf’ (you do mark up links to documents using the type attribute, right?) using the exact attribute selector, then inserts an icon advising you of the destination document:

#test_selectors a[type='application/pdf'] {
background: url('file_acrobat.gif') no-repeat 0 50%;
text-indent: 20px;
}

Finally, if you have a multi-language site you can link to another version using the lang attribute with the value of that language, then use the language attribute selector to apply that country flag:

#test_selectors a[lang|='fr'] {
background: url('fr.gif') no-repeat 0 50%;
text-indent: 20px;
}
Initial URL 
http://www.css3.info/using-css-3-selectors-to-apply-link-icons/
Initial Description 

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Css li iconified

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
CSS3

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
CSS