<!DOCTYPE html>

 <html lang="zh-CN">

 <head>

     <style type="text/css">

     .a.b{                            /*注意此处.a和.b之间没有空格*/

     background-color:blue;

     }

     .a{

         border:1px solid black;

     }

     .b{

         color:red;

     }

     </style>

 </head>

 </head>

     <body>

         <div style="width:100px;height:100px;"class="a b">

                                          /*此div 显示 红字蓝背景黑框*/

             123

         </div>

         <div style="width:200px;height:200px;" class="a">

                                      /*此div仅显示黑框*/

             123

             <div style="width:100px;height:100px;" class="b">

                                    /*此div仅显示红字*/

                 123

             </div>

         </div>

     </body>

 </html>

         在css选择器中如果两个类之间没有空格，这表示这是个多类选择器；如果有空格就表示选择第一个类中的第二个类。

css多类选择器的更多相关文章

  1. CSS伪类选择器

    一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...

  2. 关于CSS伪类选择器

    #CSS伪类选择器 ##使用css伪类选择器需要注意的 使用css的伪类选择器来选择某元素时,需要特别注意 :first-child 和 :nth-child(n) 等时, 网页渲染是从语句的后面开始 ...

  3. CSS伪类选择器 - nth-child(an+b):

    CSS伪类选择器 - nth-child(an+b): 第一种:简单数字序号写法:nth-child(number)直接匹配第number个元素.参数number必须为大于0的整数.li:nth-ch ...

  4. CSS伪类选择器active模拟JavaScript点击事件

    一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...

  5. css伪类选择器的查找顺序

    当伪类选择器last-child.first-child无效时,就是因为不了解css伪类选择器的查找顺序造成选中某一元素失败. 先给出一段dom <body> <div>第一个 ...

  6. CSS 多类选择器

    写的代码多了,就会发现,自己越来越无知了,总以为html css很简单,已经掌握的很熟练了,其实我还差的很多. 平时没有用过css的这种写法  .a.b{display:block;}   上网一查才 ...

  7. css伪类选择器及伪元素选择器

    1.类选择器 在css中可以使用类选择器把相同的元素定义成不同的样式.比如: 结果如下: 标题背景未变 2.伪类选择器 类选择器和伪类选择器的区别在于,类选择器我们定义的,而伪类选择器是CSS中已经定 ...

  8. CSS伪类选择器和伪元素选择器

    CSS的伪类选择器常用的是link/visited/hover/active,分别对应未访问.已访问过.鼠标悬停.鼠标按下时的样式,常用于链接,使用时要按此顺序依次写CSS,不能乱 a:link{ba ...

  9. css伪类选择器详细解析及案例使用-----伪类选择器（1）

    动态伪类选择器:E:link :选择匹配的E元素,并且匹配元素被定义了超链接并未被访问过.E:visited :选择匹配的E元素,而且匹配的元素被定义了连接并已被访问过.E:active :选择匹配的 ...

随机推荐

  1. iOS&nbsp;动画总结—UIView动画

    1.概述 UIKit直接将动画集成到UIView类中,实现简单动画的创建过程.UIView类定义了几个内在支持动画的属性声明,当这些属性发生改变时,视图为其变化过程提供内建的动画支持. 执行动画所需要 ...

  2. 时间序列分解-STL分解法

    时间序列分解-STL分解法 [转载时请注明来源]:http://www.cnblogs.com/runner-ljt/ Ljt 作为一个初学者,水平有限,欢迎交流指正. STL(’Seasonal a ...

  3. Leetcode_100_Same Tree

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/42061529 Given two binary trees ...

  4. Java关键字之this

    this的作用: 1) this是当前对象的一个引用,便于对当前对象参数的使用: 2)可以返回对象的自己这个类的引用,同时还可以在一个构造函数当中调用另一个构造函数 this示例: public cl ...

  5. Emotiv脑电设备与RDS机器人仿真初步测试

    Emotiv脑电设备与RDS机器人仿真初步测试 在脑电设备相关算法进行真实机器人测试前,有必要进行大量仿真验证算法,节约开发时间. 这里给我启发的Emotiv使用所参考的一些网址. 官网:https: ...

  6. UML之结尾篇

    作为十期的孩子,我们已经开发过两个系统,学生管理系统和机房收费系统,也接触了软工,编写了一系列文档,不知道小朋友有没有这种感觉,开发一个系统软件和编写一个程序是不一样的,他们之间的差别,用一个比喻来说 ...

  7. LDA主体模型

    一)LDA作用 传统判断两个文档相似性的方法是通过查看两个文档共同出现的单词的多少,如TF-IDF等,这种方法没有考虑到文字背后的语义关联,可能在两个文档共同出现的单词很少甚至没有,但两个文档是相似的 ...

  8. cocos2d-x项目与vs2013编译

    cocos2d-x项目与vs2013编译 2014-12-17 cheungmine 因为C++11引入了众多开源软件的特性,导致cocos2d-x r3.3项目无法用 vs2010编译. 所以安装了 ...

  9. 将 MVVM 演化为 MVVMM

    众所周知,MVVM模式解决了Controller的臃肿并方便单元测试,为了方便后续代码维护,在上版本新功能开发中,项目开始使用MVVM模式进行开发. 但从上图可以看出,MVVM模式中,Controll ...

  10. JavaScript发布/订阅实例

    原文链接: Pub/Sub JavaScript Object原文日期: 2014年6月11日翻译日期: 2014年6月13日 翻译人员: 铁锚 高效AJAX网站的三大杀器: 事件代理, 浏览历史管理 ...