1 <!DOCTYPE html> 2 <html lang="zh-CN"> 3 <head> 4 <style type="text/css"> 5 .a.b{ /*注意此处.a和.b之间没有空格*/ 6 background-color:blue; 7 } 8 .a{ 9 border:1px solid black; 10 } 11 .b{ 12 color:red; 13 } 14 </style> 15 </head> 16 17 </head> 18 <body> 19 <div style="width:100px;height:100px;"class="a b"> 20 /*此div 显示 红字蓝背景黑框*/ 21 123 22 </div> 23 <div style="width:200px;height:200px;" class="a"> 24 /*此div仅显示黑框*/ 25 123 26 <div style="width:100px;height:100px;" class="b"> 27 /*此div仅显示红字*/ 28 123 29 </div> 30 </div> 31 </body> 32 </html>
在css选择器中如果两个类之间没有空格，这表示这是个多类选择器；如果有空格就表示选择第一个类中的第二个类。
原文：http://www.cnblogs.com/disneyland/p/4225174.html