文档章节

scss

那些薄凉的小时光91
 那些薄凉的小时光91
发布于 2017/09/04 17:02
字数 113
阅读 2
收藏 0

 选择器嵌套

header &表示header作为nav的父集

& header表示header作为nav的子集

nav {
  a {
    color: red;

    header & {
      color:green;
    }
  }  
}

属性嵌套

.box {
  font: {
   size: 12px;
   weight: bold;
  }  
}

伪类嵌套

.clearfix{
&:before,
&:after {
    content:"";
    display: table;
  }
&:after {
    clear:both;
    overflow: hidden;
  }
}

混合宏

定义一组错误信息样式

@mixin error($borderWidth:2px){
 border: $borderWidth solid #f00; color: #f00; 
}

调用error样式

.generic-error {
 @include error();/*直接调用error Mixins*/ 
}
 .login-error {
 @include error(3px);/*调用error Mixins,并将$borderWidth参数重定义为3px*/ 
}

 

© 著作权归作者所有

共有 人打赏支持
那些薄凉的小时光91
粉丝 3
博文 23
码字总数 4753
作品 0
昌平
私信 提问
十个有用的Sass Mixins

Sass是世界上最成熟、最稳定、强大而又专业的CSS预处理器。我使用Sass有相当长的一段时间了。发现Sass的Mixins对于任何前端开发人员都非常有用,可以帮助前端开发人员节省很多时间,而且能更...

sunshinewyf
2015/10/04
115
0
利用npm实现scss的自动编译

npm实现scss自动编译 利用npm中--watch开启自动监测,只要ctrl+s自动保存并将scss文件转译为css文件 以下说一下使用步骤: 1. 安装node和npm 2. 安装ruby SASS是Ruby语言写的,但是两者的语法...

说不通的执拗
2016/12/09
26
0
webpack4 系列教程(七): SCSS提取和懒加载

教程所示图片使用的是 github 仓库图片,网速过慢的朋友请移步>>> (原文)webpack4 系列教程(七): SCSS 提取和懒加载。 个人技术小站: 有空就来看看, 我一直都在 本节课讲解在中的 SCSS 提取...

godbmw
2018/09/01
0
0
WebStorm开启Scss的Source Maps功能

本地安装好SCSS后,用WebStorm工具新建一个'*.scss'文件,就会自动提醒是否'Add watcher',直接点击一下就OK啦;前提是要本机安装了Ruby和SCSS才行; 这样WebStorm就会自动新建一个scss的'wa...

渊翼
2014/06/08
0
2
scss转换成css,hotcss

1.将scss文件转换成css文件的步骤: Ubuntu系统: sudo apt-get install ruby sudo apt install ruby-sass sudo gem install sass 建立文件夹,新建index.html 和style.scss 1.cd 文件夹 2.......

wftt
2018/02/06
0
0

没有更多内容

加载失败,请刷新页面

加载更多

mysql 查询当天、本周,本月,上一个月的数据

今天 select * from 表名 where to_days(时间字段名) = to_days(now()); 昨天 SELECT * FROM 表名 WHERE TO_DAYS( NOW( ) ) - TO_DAYS( 时间字段名) <= 1 近7天 SELECT * FROM 表名 wher......

BraveLN
19分钟前
2
0
Android Multimedia框架总结(六)C++中MediaPlayer的C/S架构

前面几节中,都是通过java层调用到jni中,jni向下到c++层并未介绍 看下Java层一个方法在c++层 MediaPlayer后续过程 frameworks/av/media/libmedia/MediaPlayer.cpp 找一个我们之前熟悉的setDa...

天王盖地虎626
37分钟前
2
0
【Linux】【MySQL】CentOS7安装最新版MySQL8.0.13(最新版MySQL从安装到运行)

1、前言   框框博客在线报时:2018-11-07 19:31:06   当前MySQL最新版本:8.0.13 (听说比5.7快2倍)   官方之前表示:MySQL 8.0 正式版 8.0.11 已发布,MySQL 8 要比 MySQL 5.7 快 2 ...

Code辉
37分钟前
1
0
oracle dg备库重建redolog:ora-00313,ora-00312

trace文件: Errors in file /crbank/dbs/app/product/diag/rdbms/rdbs/dbs/trace/dbs_mrp0_24445130.trc: ORA-00313: open failed for members of log group 8 of thread 1 ORA-00312: onl......

hnairdb
51分钟前
1
0
深入分析Java I/O的工作机制 (一)

1.Java的I/O类库的基本架构 先说一下什么是类库:可以说是类的集合,类库包括接口、抽象类、具体类等。 I/O是机器获取和交互信息的主要渠道。 java在I/O上也一直在做持续的优化,在1.4版开始...

java菜分享
59分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部