Sass-父选择器???自身选择器

父选择器&

#outside{
    width: 61.8%;
    height: 200px;
    background-color: grey;
}

.inside{
    color: white;
    background: purple;
    border-radius: 5px;
    font-size: 20px;
    font-weight: bolder;
    text-align: center;
    display: block;
    &:hover{
        color: yellow;
    }
}

但是编译后是这样的

#outside {
  width: 61.8%;
  height: 200px;
  background-color: grey; }

.inside {
  color: white;
  background: purple;
  border-radius: 5px;
  font-size: 20px;
  font-weight: bolder;
  text-align: center;
  display: block; }
  .inside:hover {
    color: yellow; }

说好的父选择器呢?这只是个自身的选择器啊

时间: 2024-10-06 16:04:57

Sass-父选择器???自身选择器的相关文章

CSS3选择器(基础选择器、属性选择器、伪类选择器、选择器策略)

<CSS3基本选择器> 一.通配符选择器(*) *{ marigin: 0; padding: 0; } 二.元素选择器(E) li {background-color: grey;color: orange;} 三.类选择器(.className) 四.id选择器(#ID) #first {background: lime;color: #000;} #last {background: #000;color: lime;} 五.后代选择器(E F) .demo li {color: blu

CSS3 选择器 基本选择器介绍

CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选择器主要是用来确定html的树形结构中的DOM元素节点.我把CSS选择器分开成三部分,第一部分是我们常用的部分,我把他叫做基本选择器:第二部分我把他称作是属性选择器,第三部分我把他称作伪类选择器,这一部分也是最难理解和掌握的部分,今天我们先来看第一部分——基本选择器.我们先来看一个常用的选择器列表图

jquery用户自定义选择器及选择器高级用法实验

//用户自定义选择器 $(function(){ // Define custom filter by extending $.expr[":"] $.expr[":"].greenbg = function(element) { return $(element).css("background-color") === "rgb(0, 128, 0)"; }; var n = $(":greenbg").

CSS系列------选择器和选择器的优先级

1.1.基本选择器 通配符选择器(*)      通配符选择器的使用方法如下 *{margin:0px; padding:0px;} //*代表所有的 ID选择器(#) ID选择器的使用方式如下: *#intro {font-weight:bold;}//也可以省略通配符 #intro{font-weight:bold;} //两种方式是一样的. 不同于其他选择器,id选择器有以下特点 规范: 同一个id,在一个网页中只能标注一个元素. 如果有同名id ,则在CSS中用ID选择器时,依旧会匹配所

JQuery选择器——层级选择器

JQuery层级选择器 1   全选择器          $("*") 又名*选择器,在JQuery中选择文档页面中的元素,通配符*给所有元素设置默认边距 2   在.getElementsByTagName()传递*可以获取所有元素 3   getElementById的兼容性 getElementById的参数在IE8及较低的版本中不区分大小写 IE8及较低的版本,浏览器不支持getElementByClassName IE会将注释节点实现为元素,在IE中调用getElement

jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法

jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法 一丶什么是JQuery JQuery: ???????JQuery是js的一个库,高度封装了js常用的功能,提供简便方法,调用简单,提高开发效率 ??????js库是包含了把复杂的功能封装到简单的方法中 JQuery的两大特性: ???????链式编程:可以.的形式实现多个功能 ?

前端之CSS的属性引入方式、选择器、选择器优先级

目录 1011 前端之CSS的属性引入方式.选择器.选择器优先级 一.CSS介绍 二.CSS语法 2.1CSS实例 2.2 CSS注释 三.css属性的引入方式 3.1 行内样式 3.2 内部样式 3.3 外部样式 四.CSS选择器 4.1 元素(标签)选择器 4.2 id选择器 4.3 类选择器 4.4 通用选择器 4.5 后代选择器 4.6 儿子选择器 4.7 毗邻选择器 4.8 兄弟选择器 4.9 属性选择器 4.10 分组和嵌套选择器 4.11 伪类选择器 4.12 伪类元素选择器 五.

CSS选择器--普通选择器

普通选择器: 1.标签选择器:使用标签选择器,所有的相同的标签都会被选中.(如:选择div所有的div都被选中.) 2.类选择器:如果一个元素设置了多个类选择器样式,那么这些类选择器都会被设置.但是如果类选择器中样式有设置重复的,那么就按照就近原则设置.[在普通选择器是最常用的选择器] (如:<div class="one  two  "> .one{ color:red; background:blue; } .two { color:yellow; }   颜色都设置过

jQuery easyUI id选择器 类选择器 标签选择器 属性选择器 及DOM对象和jQuery相互之间的转换

首先导入js文件 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"

CSS3 选择器之基本选择器 属性选择器 伪类选择器

CSS 选择器 常见的选择器列表图 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className)    所有浏览器都支持类选择器,但多类选择器(.className1.className2)不被ie6支持. id选择器(#ID) 后代选择器(E F) 子元素选择器(E>F)    IE6不支持子元素选择器.