This selector can match elements that have the specified attribute and the attribute value contains the specified value. The code example is as follows:
<!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" title="target">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 the element that has the id attribute and the id attribute value contains ne. The font color in the li element is set to red.
Of course, multiple selectors can also be used together. The code is as follows:
li[id*="ne"][title*="ar"]{ color:red; }