This selector is exactly the opposite of the E[attr^="value"] selector. It can match elements whose attribute values end with the specified value
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://ask.php.cn/" /> <title>php中文网</title> <style type="text/css"> li{ list-style:none; float:left; height:20px; line-height:20px; width:20px; border:1px solid #333; border-radius:10px; border-radius:10px; border-radius:10px; text-align:center; color:green; margin-right:5px; } li[id$="ne"]{ color:red; } </style> </head> <body> <div class="antzone"> <ul> <li>1</li> <li>2</li> <li id="antzone">3</li> <li id="bntzone">4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> </ul> </div> </body> </html>
The above code can match li whose id attribute ends with ne The element's font color is set to red.
Of course, multiple selectors can also be used together. The code is as follows:
li[id$="ne"][title$="et"]{ color:red; }Next Section