码迷,mamicode.com
首页 > Web开发 > 详细

css多类选择器

时间:2015-01-15 00:15:34      阅读:223      评论:0      收藏:0      [点我收藏+]

标签:


 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选择器中如果两个类之间没有空格,这表示这是个多类选择器;如果有空格就表示选择第一个类中的第二个类。

css多类选择器

标签:

原文地址:http://www.cnblogs.com/disneyland/p/4225174.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!