scss-@extend
@extend指令用于共享规则和选择器之间的关系。它可以扩展所有其他类的样式在一个类中,也可应用于自己特定的样式。
查看如下scss@extend示例:
.style{
font-size: 30px;
font-style: italic;
}
h2{
color: #787878;
@extend .style
}
.container{
@extend h2
}
编译后的css代码如下:
.style, h2, .container {
font-size: 30px;
font-style: italic;
}
h2, .container {
color: #787878;
}
scss-@extend的更多相关文章
- [SCSS] Reuse Styles with the SCSS @extend Directive
We can write reusable styles with the SCSS @extend or @mixin directives. Which one is better? It dep ...
- 多媒体查询 @media 报错
You may not @extend an outer selector from within @media.You may only @extend selectors within the s ...
- css预编译语言 sass scss(变量$var, css嵌套规则,@import规则,@extend,@mixin)
什么是sass Sass 是对 CSS 的扩展,让 CSS 语言更强大.优雅. 它允许你使用变量.嵌套规则. mixins.导入等众多功能, 并且完全兼容 CSS 语法. Sass 有助于保持大型样式 ...
- CSS预处理框架:less,scss
CSS预处理器:less和sass:CSS 预处理器是一种语言用来为 CSS 增加一些编程的的特性,无需考虑浏览器的兼容性问题,例如你可以在 CSS 中使用 变量.简单的程序逻辑.函数等等在编程语言中 ...
- Scss开发临时学习过程
SCSS语法: 假设变量申明带有!default,那么如果在此申明之前没有这个变量的申明,则用这个值,反之如果之前有申明,则用申明的值. ‘...’传递多个参数: @mixin box-shadow( ...
- sacc scss less
CSS 预处理器技术已经非常的成熟,而且也涌现出了越来越多的 CSS 的预处理器框架.本文向你介绍使用最为普遍的三款 CSS 预处理器框架,分别是 Sass.Less CSS.Stylus. 首先我们 ...
- 前端scss的使用及gulp发布方式
如标题所述,这篇博文是说scss以及gulp发布方式: 如果你没用过scss和gulp或不甚了解,你可以看看这篇博文,叙说的水平有限,各位看官大神见谅: 说scss之前,先来说说sass,sass是一 ...
- sasscore学习之_mixin.scss
_mixin scss包括常用的mixin,%及@functionmixin,通过@include调用,样式通过拷贝的方式使用,尤其适用于传递参数%,通过@extend调用,样式通过组合申明的方式使用 ...
- .scss写法及如何转化为.css
scss可视化工具:http://koala-app.com/index-zh.html scss讲解地址:http://www.cnblogs.com/adine/archive/2012/12/1 ...
随机推荐
- logging、hashlib、collections模块
一.hashlib模块(加密模块) 1.什么叫hash:hash是一种算法(3.x里代替了md5模块和sha模块,主要提供 SHA1, SHA224, SHA256, SHA384, SHA512 , ...
- 15、OpenCV Python 轮廓发现
__author__ = "WSX" import cv2 as cv import numpy as np # 基于拓扑结构来发现和绘制(边缘提取) # cv.findConto ...
- 「模拟赛20190327」 第二题 DP+决策单调性优化
题目描述 小火车虽然很穷,但是他还是得送礼物给妹子,所以他前往了二次元寻找不需要钱的礼物. 小火车准备玩玩二次元的游戏,游戏当然是在一个二维网格中展开的,网格大小是\(n\times m\)的,某些格 ...
- IOS中NSUserDefaults的用法
NSUserDefaults适合存储轻量级本地数据,比如要保存用户登陆的用户名.密码,使用NSUserDefaults是首选.下次再登陆的时候就可以直接从NSUserDefaults里面读取上次登陆的 ...
- sql 表字段模糊连接
select AreauserCode,RtuName from TB_AreaUser as tau right join TB_MaintenanceInfo inf on inf.RtuName ...
- python学习之路---day02
一:while循环 while 条件语句 #如果条件成立则执行下面的循环语句 循环语句 eg1:1+2+3+4+5......+100=? num=0 #给num和sum赋初值 sum=0 while ...
- Android 对话框的应用1
1.介绍 2.作用 (1)消息提示对话框 (2)简单列表对话框 (3)单选列表对话框 (4)多选对话框 (5)自定义对话框 3.java后台代码 package com.lucky.test28dia ...
- ubuntu设置静态 ip
查看ip和DNS 终端输入ifconfig获取ip,子网掩码.输入nm-tool获取网关,DNS 修改配置文件/etc/network/interfaces root@ubuntu:~# sudo g ...
- HDU - 3949 线性基应用
题意:求第\(k\)小的异或和 要点: 1.线性基能表示原数组的任意异或和,但不包括0,需特判(flag) 2.线性基中的异或组合只有\(2^{|B|}-1\)个,如果可以异或为0,则组合数为\(2^ ...
- HDU - 2089 数位DP 初步
中文题目,不要62和4 从高位往低位DP,注意有界标志limit的传递 dp2记忆有界情况下的计数结果,据说用处不大 我所参考的入门文章就是半搜索(有界)半记忆(无界)的 进阶指南中提出dfs维度有多 ...