1、结合元素选择器

<p class="important">css</p>

p.important {color: red}

匹配class属性包含important的所有p元素

2、多类选择器

<div class="option selected"></div>

.option.selected {color: red}

匹配class属性同时包含option和selected的元素

sass里写法:

.option {

  &.selected {color: red}

}

css 类选择器结合元素选择器和多类选择器的更多相关文章

  1. jQuery-day01-介绍 和 选择器获取元素

    1 ,jQuery介绍 1.1,jquery的介绍,javascript库的关系.体验jquery.把js兼容性代码封装在jquery.js中,本身就是一个javascript库. 1.2,jQuer ...

  2. 关于css伪类,伪元素详解总结

    伪类 伪类就是一种虚构的状态或者说是一个具有特殊属性的元素可以使用CSS进行样式修饰.常见的几种伪类是: :link , :visited , :hover , :active , :first-ch ...

  3. CSS 属性 :before && :after的用法,伪类和伪元素的区别

    一::before && :after的用法 :before 如同对伪元素的名称一样,:before 是用来给指定的元素的内容前面插入新的内容.举例说明: .before:before ...

  4. CSS之 :before && :after的用法,伪类和伪元素的区别

    一::before && :after的用法 :before 如同对伪元素的名称一样,:before 是用来给指定的元素的内容前面插入新的内容.举例说明: .before:before ...

  5. CSS3伪类与伪元素的区别及注意事项

    CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别 定义 首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类:用于向某些选择器添加特殊的效果 伪元素:用于将特 ...

  6. 【CSS】伪类和伪元素选择器

    伪类 基于当前元素所处的状态或具有的特性,用于设置元素自身的特殊效果. a:link  规定所有未被点击的链接: a:visited  匹配多有已被点击过的链接: a:active  匹配所有鼠标按下 ...

  7. python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  8. CSS一个元素同时使用多个类选择器(class selector)

    CSS类选择器参考手册 一个元素同时使用多个类选择器 CSS中类选择器用点号表示.实际项目中一个div元素为了能被多个样式表匹配到(样式复用),通常div的class中由好几段组成,如<div ...

  9. CSS样式表及选择器相关内容(二)-伪类与伪元素选择器

    伪类与伪元素选择器归纳: 一.伪类选择器(伪类以":"开头,用在选择器后,用于指明元素在某种特殊的状态下才能被选中)    1.a标签伪类选择器,其他标签类似        eg: ...

随机推荐

  1. nagios系列(二)之nagios客户端的安装及配置

    1.添加nagios用户 echo "------ step 1: add nagios user------" #create user group /usr/sbin/user ...

  2. Nodejs 实现ESL内联FreeSWITCH设定说明

    一.背景说明: SIP Server IP (Centos):192.168.11.61  ,服务器IP(Windows):192.168.11.19 二.目的: 能够从192.168.11.19上通 ...

  3. 转载:《理解OAuth 2.0》 阮一峰

    原文:http://www.ruanyifeng.com/blog/2014/05/oauth_2_0.html OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛 ...

  4. PYTHON-模块 sys os random shutil-练习

    # 作业:# 添加工程根目录至环境变量 要求可以跨平台# import sys,os# BATH_DIR=os.path.dirname(os.path.dirname(__file__))# sys ...

  5. IntelliJ IDEA 下的svn配置及使用的非常详细的图文总结

    首先,使用的时候,自己得先在电脑上安装个小乌龟.也就是svn啦. 第一步安装小乌龟. 如下: 具体安装好像没什么具体要求,一路next,就好. 如上图箭头所示,在安装 TortoiseSVN 的时候, ...

  6. InnoDB的关键特性-插入缓存,两次写,自适应hash索引

    InnoDB存储引擎的关键特性包括插入缓冲.两次写(double write).自适应哈希索引(adaptive hash index).这些特性为InnoDB存储引擎带来了更好的性能和更高的可靠性. ...

  7. ubuntu 语言设置

    1.ubuntu ibus 输入法无法切换拼音 原因未安装中文输入法 sudo apt install ibus-pinyin //安装pinyinwin + space(空格) 切换中文输入法 再用 ...

  8. VS Code 折腾记 - (6) 基本配置/快捷键定义/代码片段的录入(snippet)

    前言 本来分成三篇来写的,但是想了想没必要,大家都是聪明人...简单的东西点一下就晓得了. 基本配置 快捷键自定义(Ctrl+K Ctrl + S) 那个when支持条件表达式返回一个布尔值 支持的快 ...

  9. Flink(三)Flink开发IDEA环境搭建与测试

    一.IDEA开发环境 1.pom文件设置 <properties> <maven.compiler.source>1.8</maven.compiler.source&g ...

  10. bzoj4184

    题解: 按时间分治线段树 然后线性基维护一下就好了 尝试了一下循环展开并没有什么效果 代码: #include <bits/stdc++.h> using namespace std; ; ...