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 ...
随机推荐
- 1.Java 程序工作原理
JVM:JAVA虚拟机,java程序运行在jvm上,jvm是java程序的运行环境. java程序的平台无关性:java编写的程序(.java)经过编译器变异成字节码文件(.class).这个字节码文 ...
- External Tools
Preferences偏好设置-External Tools External Tools: External Script Editor:外部脚本编辑器,通过此项可以切换您所擅用的脚本的编辑器 Ed ...
- phpmyadmin更改用户名和密码
我是用的xampp集成环境,wampp也差不多.另外没有配图,希望读者可以在实践的过程中有所思考,本文的主旨就是:找一个不叫root但和root一样厉害的人来管理数据库. 1,做个准备 首先创建一个和 ...
- DQL、DML、DDL、DCL的区别
1. 历史发展 SQL(Structure Query Language)语言是数据库的核心语言. SQL的发展是从1974年开始的,其发展过程如下:1974年-----由Boyce和Chamberl ...
- 校园网络安全CTF 第一题 和 你真了解我吗?
第一题: 需要先找到相应头(REsponse header中的tips) <?php$flag = "***";if (isset($_GET['repo']))//检测变量 ...
- C# 关于时区的操作
有关时区自动更新的 在注册表以下路径,start键值3,4表示自动/不自动更新 计算机\HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\tza ...
- BZOJ - 1026 数位DP
中文题面,注意st是不可以放到dp里面的,否则每次solve都要清零 注意状态的转移要st&&i==0,因为子结构也可能是st(当高位取0时) 而st是必然合法的 #include&l ...
- 隐藏入口文件的apache配置
AllowOverride None->AllowOverride All #LoadModule rewrite_module modules/mod_rewrite.so->LoadM ...
- datetime和date如何转json
import json from datetime import datetime, date class MyJson(json.JSONEncoder): def default(self, o) ...
- 网络那点事之socket队列
1.socket 在内核中是怎么表示的,怎么与文件系统建立关系 2.socket在什么时候创建了接收队列,接收队列的长度是怎么确定的 3.接收到一个数据包根据怎么找到到接收队列的 使用hash算法,分 ...