1.时常见到css的这两种种写法：

a.两个class隔空格连一起：

.class1 .class2{......}

b.两个class隔逗号连一起：

.class1,.class2{......}

2.举两个例子说明：

两个class隔空格连一起,例A：

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>两个class隔空格连一起</title>

    <style type="text/css">

        .classDiv {

            height: 200px;

            width: 200px;

            background-color: aqua;

        }

         .classDiv .classP {

             color: hotpink;

             background-color: #e7e7e7;

         }

    </style>

</head>

<body>

    <div class="classDiv">

        <p class="classP">

            .classDiv .classP对我生效

        </p>

        .classDiv .classP对我无效

    </div>

    <p class="classP">

        .classDiv .classP对我生效

    </p>

</body>

</html>

例A结果：

两个class隔逗号连一起,例B：

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>两个class隔逗号连一起</title>

    <style type="text/css">

        .classDiv {

            height: 200px;

            width: 200px;

            background-color: aqua;

        }

         .classDiv .classP {

             color: hotpink;

             background-color: #e7e7e7;

         }

    </style>

</head>

<body>

    <div class="classDiv">

        <p class="classP">

            .classDiv .classP对我生效

        </p>

        .classDiv .classP对我无效

    </div>

    <p class="classP">

        .classDiv .classP对我生效

    </p>

</body>

</html>

例B结果：

3.结果说明：

a写法只对两个class中的后者有效，前者起到过滤的作用；b写法对所有class都有效。

.class1 .class2{......}

(十三)学习CSS之两个class连一起隔空格和逗号的更多相关文章

  1. 学习 CSS 样式

    1.CSS浮动  :  http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论:           ...

  2. css知多少（2）——学习css的思路

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1． 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  3. 【图片版】学习CSS网格布局

    简言 CSS网格布局(Grid)是一套二维的页面布局系统,它的出现将完全颠覆页面布局的传统方式.传统的CSS页面布局 一直不够理想.包括table布局.浮动.定位及内联块等方式,从本质上都是Hack的 ...

  4. 学习CSS的思路（转）

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1． 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  5. 《学习CSS布局》学习笔记

    近几天做了一个小的企业展示网站.虽然页面是在模板的基础上改的,但改的多了不熟悉CSS也很麻烦.正好我看到了学习CSS布局这个网站,于是补习了一下CSS知识. CSS的显示 CSS的元素分为两类:块级元 ...

  6. CSS 简介，学习 CSS 必看

    CSS 表示的是层叠样式表,学习 CSS 之前我们必须要掌握 HTML 和 XHTML 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 ...

  7. css的两种盒子模型

    css的两种盒子模型:W3C标准盒子模型.IE盒子模型 两者的相同之处:都包含margin.border.padding.content 两者的不同之处:W3C标准盒子模型的content部分不包含其 ...

  8. 开始学习css

    今天开始学习css:应用一本<HTML5与CSS3网页设计基础> 先学习css样式规则声明. Body{ color:blue} 对应:选择符:{声明属性:声明值}: Background ...

  9. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

随机推荐

  1. seo 优化 仅针对 来拍呀www.laipaiya.com（一）

    加入百度统计代码:http://tongji.baidu.com/ 查看百度统计优化分析->seo建议 对每个页面的meta标签做修改 首页 title :来拍呀 - | 折扣好房你就来拍呀 k ...

  2. Fedora 17安装NFS

    1.NFS概述 NFS(Network File System)是一种分布式文件系统,允许网络中的安装不同操作系统的计算机间共享文件和外设,所以它的通讯协定设计与主机及作业系统无关. 它是由SUN公司 ...

  3. 八、mysql视图、存储过程、函数以及时间调度器

    .create or replace view emp_view as select * from t4 ;给t4表创建一个名为emp_view的视图 .drop view emp_view 删除视图 ...

  4. 同一台Windows机器中启动多个Memcached服务

    同一台Windows机器中启动多个Memcached服务 这就需要在一台机器上启动多个Memcached服务了. 假设Memcached在如下目录:C:\memcached\memcached.exe ...

  5. CodeForces 32C

    额  找找规律吧  要用long long 才过. #include <cstdio> #include <algorithm> using namespace std; in ...

  6. PHP set_exception_handler 设置异常处理函数

    If you're handling sensitive data and you don't want exceptions logging details such as variable con ...

  7. linux查看历史命令history

    在linux下,我们有可能需要查看最近执行过的命令(历史命令),我们可以进行如下操作: # 显示使用过的所有历史命令 $ history # 显示最近使用的5个命令 $ history 5 我们可以通 ...

  8. windows8 64位 IIS8 PHP5.5 安装 Imagemagick 组件

    为什么这里一定要说 windows 系统是64位呢,因为如果是系统是64位,那么PHP5.5 一般都会选择64的, Imagemagick 组件也会选择64位的, 但是操蛋的是 64位的Imagema ...

  9. javaweb学习总结(四十七)——监听器(Listener)在开发中的应用

    监听器在JavaWeb开发中用得比较多,下面说一下监听器(Listener)在开发中的常见应用 一.统计当前在线人数 在JavaWeb应用开发中,有时候我们需要统计当前在线的用户数,此时就可以使用监听 ...

  10. javaweb学习总结(四十五)——监听器(Listener)学习二

    一.监听域对象中属性的变更的监听器 域对象中属性的变更的事件监听器就是用来监听 ServletContext, HttpSession, HttpServletRequest 这三个对象中的属性变更信 ...