<!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. SpriteBuilder中不能编辑自定义类或不能给节点添加属性的解决

    不能编辑自定义类 你选中一个Sub File(CCBFile)节点,在这个例子中,该节点的Custom class区域灰化禁用且不能修改.这是因为你需要在该Sub File引用的CCB文件中修改Cus ...

  2. 【一天一道LeetCode】#31. Next Permutation

    一天一道LeetCode系列 (一)题目 Implement next permutation, which rearranges numbers into the lexicographically ...

  3. 图像检索：FCTH（Fuzzy Color and Texture Histogram）算法

    模糊颜色和纹理直方图(Fuzzy Color and Texture Histogram,FCTH) 本文节选自论文<基于半监督和主动学习相结合的图像的检索研究> FCTH 特征可从 3 ...

  4. 如何编写51单片机超声波测距SR04_lcd1602显示程序

    超声波测距在我们日常生活中很常见,比如说车在倒退的时候,为了防止车撞到障碍物,会在车尾加上一个超声波测距模块.在智能车比赛中,也有超声波测距模块等等.可见超声波非常的重要,接下来,我们上代码研究一下如 ...

  5. android 屏幕适配,hdpi,xhdpi,xxhdpi理解,常见出图

    屏幕适配 首先理解下各个尺寸单位代表的意思 尺寸含义 px: 像素 dip: Density-independent pixel 独立像素密度 dpi: dot per inch 分辨率 ppi: p ...

  6. tomcat会话之持久化会话管理器

    前面提到的标准会话管理器已经提供了基础的会话管理功能,但在持久化方面做得还是不够,或者说在某些情景下无法满足要求,例如把会话以文件或数据库形式存储到存储介质中,这些都是标准会话管理器无法做到的,于是另 ...

  7. Learning ROS for Robotics Programming Second Edition学习笔记(一) indigo v-rep

    中文译著已经出版,详情请参考:http://blog.csdn.net/ZhangRelay/article/category/6506865 Learning ROS for Robotics Pr ...

  8. Makefile的obj-y 和 obj-m

    目标定义是Kbuild Makefile的主要部分,也是核心部分.主要是定义了要编 译的文件,所有的选项,以及到哪些子目录去执行递归操作. 最简单的Kbuild makefile 只包含一行: 例子: ...

  9. OpenCV矩阵运算

    矩阵处理 1.矩阵的内存分配与释放 (1) 总体上: OpenCV 使用C语言来进行矩阵操作.不过实际上有很多C++语言的替代方案可以更高效地完成. 在OpenCV中向量被当做是有一个维数为1的N维矩 ...

  10. Unity Singleton 单例类（Unity3D开发之二十）

    猴子原创,欢迎转载.转载请注明: 转载自Cocos2Der-CSDN,谢谢! 原文地址: http://blog.csdn.net/cocos2der/article/details/47335197 ...