1、在 HTML 中,一个 class 值中可能包含一个词列表,各个词之间用空格分隔。例如,如果希望将一个特定的元素同时标记为重要(important)和警告(warning),就可以写作(这两个词的顺序无关紧要,写成 warning important 也可以):

  1. <p class="important warning">
  2. This paragraph is a very important warning.
  3. </p>

我们假设 class 为 important 的所有元素都是粗体,而 class 为 warning 的所有元素为斜体,class 中同时包含 important 和 warning 的所有元素还有一个银色的背景 。就可以写作:

  1. .important {font-weight:bold;}
  2. .warning {font-weight:italic;}
  3. .important.warning {background:silver;}

2、通过把两个类选择器链接在一起,仅可以选择同时包含这些类名的元素(类名的顺序不限)。

如果一个多类选择器包含类名列表中没有的一个类名,匹配就会失败。请看下面的规则:

  1. .important.urgent {background:silver;}

不出所料,这个选择器将只匹配 class 属性中包含词 important 和 urgent 的 p 元素。因此,如果一个 p 元素的 class 属性中只有词 important 和 warning,将不能匹配。不过,它能匹配以下元素:

  1. <p class="important urgent warning">
  2. This paragraph is a very important and urgent warning.
  3. </p>

CSS类与选择器【转】http://www.cnblogs.com/duanhuajian/archive/2012/12/17/2821524.html的更多相关文章

  1. zero3- JPA http://www.cnblogs.com/holbrook/archive/2012/12/30/2839842.html

    1.很好的博客:http://www.cnblogs.com/holbrook/archive/2012/12/30/2839842.html 2. 最新的搬到github : http://holb ...

  2. @无痕客 https://www.cnblogs.com/wuhenke/archive/2012/12/24/2830530.html 通篇引用

    无痕客 https://www.cnblogs.com/wuhenke/archive/2012/12/24/2830530.html 关于Async与Await的FAQ 关于Async与Await的 ...

  3. (转)Jquery最实用的实例及源码(http://www.cnblogs.com/kingfly/archive/2012/12/05/2802539.html)

    1:窗口拖动 http://jqueryui.com/resizable/#max-min 2:导航条前后顺序拖动 http://jqueryui.com/sortable/ 3:类似百度首页板块顺序 ...

  4. C1FlexGrid小结(转自http://www.cnblogs.com/C1SupportTeam/archive/2012/12/11/2812316.html)

    C1FlexGrid控件来对一个表格格式中的数据进行显示,编辑,组和总结.该表格可以绑定到一个数据源,它可以对自己的数据进行管理. C1FlexGrid控件有一个包含以下元素的丰富的对象模型: 以下的 ...

  5. Hadoop上的中文分词与词频统计实践 (有待学习 http://www.cnblogs.com/jiejue/archive/2012/12/16/2820788.html)

    解决问题的方案 Hadoop上的中文分词与词频统计实践 首先来推荐相关材料:http://xiaoxia.org/2011/12/18/map-reduce-program-of-rmm-word-c ...

  6. 基于dsp_builder的算法在FPGA上的实现(转自https://www.cnblogs.com/sunev/archive/2012/11/17/2774836.html)

    一.摘要 结合dsp_builder.matlab.modelsim和quartus ii等软件完成算法的FPGA实现. 二.实验平台 硬件平台:DIY_DE2 软件平台:quartus ii9.0 ...

  7. http://www.cnblogs.com/Lawson/archive/2012/09/03/2669122.html

    http://www.cnblogs.com/Lawson/archive/2012/09/03/2669122.html

  8. http://www.cnblogs.com/Matrix54/archive/2012/05/03/2481260.html

    http://www.cnblogs.com/Matrix54/archive/2012/05/03/2481260.html

  9. http://www.cnblogs.com/java-my-life/archive/2012/05/28/2516865.html

    http://www.cnblogs.com/java-my-life/archive/2012/05/28/2516865.html

随机推荐

  1. WANNACRY病毒中的加密技术分析

    WANNACRY病毒中的加密技术分析 2019/11/6 16:56:46 分析WANNACRY病毒中的加解密技术的应用.分析内容包括但不限于:对称密码技术和公钥密码技术的作用:受害者支付赎金后就会恢 ...

  2. 获取 ProgramData 之类的环境变量(文件夹路径)的值

    GetEnvironmentVariable Recognized Environment Variables https://docs.microsoft.com/en-us/windows/dep ...

  3. Solidity的Bytecode和Opcode简介

    Solidity的Bytecode和Opcode简介 随着我们更深入地编写智能合约,我们将遇到诸如" PUSH1"," SSTORE"," CALLV ...

  4. springmvc返回不带引号的字符串

    springmvc返回不带引号的字符串项目使用springboot开发的,大部分出参为json,使用的fastJson,现在有的接口需要返回一个success字符串,发现返回结果为“success”, ...

  5. eclipse安装Axis2插件和简单的webservice发布

    2019独角兽企业重金招聘Python工程师标准>>> Axis2与CXF是现在很主流的WebService开发框架(java6也已经支持了),项目上还都是基本上用前两种做开发,今天 ...

  6. mac OS 卸载node.js及npm

    通过homebrew安装的 输入卸载命令 brew uninstall node 通过官网下载pkg安装包的 输入卸载命令 sudo rm -rf /usr/local/{bin/{node,npm} ...

  7. php并发加锁

    CleverCode在工作项目中,会遇到一些php并发访问去修改一个数据问题,如果这个数据不加锁,就会造成数据的错误.下面CleverCode将分析一个财务支付锁的问题. 1 没有应用锁机制 1.1 ...

  8. Codeforce 1102 C. Doors Breaking and Repairing

    Descirbe You are policeman and you are playing a game with Slavik. The game is turn-based and each t ...

  9. 【UEFI】---史上最全的X86平台启动流程分析(软硬结合)

    最近研究了下X86处理器的启动流程分析,相比于常见的ARM来说,X86平台启动流程真的复杂了很多,本次基于项目实际的两个问题入手,研究了包括以下几个部分的内容: 1. 从硬件角度看启动流程 2. 从软 ...

  10. <学习笔记之 JQuery>

    1. mouseenter   当鼠标指针进入(穿过)元素时,触发事件 var is_enter_help = false; $("#help-div").mouseenter(f ...