scss的基本用法

Yi_Zhi_Yu 发布于2019-08-30 15:44 / 871人阅读

摘要：一定义变量定义变量基本用法变量作为字符串拼接二简单的计算加减乘除三选择器嵌套四继承样式五使用，强大之处在于可以传递参数不传参传参初始化默认值六导入外部七高级用法，循环语句和自定义函数的使用自定义函数

一、定义变量

二、简单的计算加减乘除

三、选择器嵌套

四、继承样式 @extend

五、@mixin @include 使用，强大之处在于可以传递参数

六、导入外部scss、css @import

七、高级用法，循环语句和自定义函数的使用

@for $i from 1 to 10 {
  // .myLi1 .myLi2 .myLi3 ...... .myLi10
  .myLi#{$i} {
    border: #{$i}px solid #468dcc;
  }
}

// 自定义函数
@function myScssFun($p) {
  @if $p > 10 {
      @return $p;
  } @else {
      @return $p * 2;
  }
}
div {
    font-size: myScssFun(10px);
}

私有云服务器托管基本用法 JSTL基本用法 SCSS html5 scss

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/116270.html

SASS详解

摘要：以前看到之类的工具觉得应该比较难，今天接触了之后发现挺好用的，主要是方便了的编写。具体可以看慕课网教程编译方法在命令行输入编译单个文件编译整个文件夹到文件夹也就是这样的语法下文中我都这样写。这里贴一张慕课网拿到的表格。以前看到SASS之类的工具觉得应该比较难，今天接触了之后发现挺好用的，主要是方便了CSS的编写。在编写比较大的项目的时候，由于内容很多，因此样式表也会比较繁杂，如果要修...

余学文 2019-08-29 11:29 评论0 收藏0
SCSS学习笔记（一）

摘要：的由来就是加强版的，要讲那就一定要从讲起英文全称是一个最初由设计并由开发的层叠样式表语言。年发行，年版本稳定，设计和开发分开进行，让这个语言的功能相当完善。变量允许使用变量，所有变量以开头。 SCSS的由来 SCSS就是加强版的CSS，要讲SCSS那就一定要从SASS讲起 SASS Sass（英文全称：Syntactically Awesome Stylesheets）是一个最初由Ha...

simpleapples 2019-08-29 16:37 评论0 收藏0
SASS学习记录

摘要：前言很久没有用文章记录自己的学习历程了，主要是因为实在写的不行，相比大牛写的博客，我这只能算是东拼西凑或者说是读书笔记。以前我只使用外部，现在的更加好用，所以在学习过程中记了一些笔记。在后面加一个感叹号，表示这是重要注释。前言很久没有用文章记录自己的学习历程了，主要是因为实在写的不行，相比大牛写的博客，我这只能算是东拼西凑或者说是读书笔记。但是今天还是拾起笔来了，虽然没什么干货，但...

tylin 2019-08-20 14:25 评论0 收藏0
SASS学习记录

摘要：前言很久没有用文章记录自己的学习历程了，主要是因为实在写的不行，相比大牛写的博客，我这只能算是东拼西凑或者说是读书笔记。以前我只使用外部，现在的更加好用，所以在学习过程中记了一些笔记。在后面加一个感叹号，表示这是重要注释。前言很久没有用文章记录自己的学习历程了，主要是因为实在写的不行，相比大牛写的博客，我这只能算是东拼西凑或者说是读书笔记。但是今天还是拾起笔来了，虽然没什么干货，但...

HollisChuang 2019-08-30 15:52 评论0 收藏0
SCSS 日常用法

摘要：生成相互嵌入这个是最常用的，通过定义一个类或方法，在其它地方通过引用这个方法或类。生成注意事项不能继承这种连续组合的类，应该写为常用方法详见不知道别人，反正我最常用的就是颜色方法了。 SCSS 日常用法本文是以自己的理解起的结构，要看详细的帮助文档，参阅这里：https://sass-lang.com/documen... 你需要了解的 less 和 sass 是两种 css 预编...

Lyux 2019-08-29 18:45 评论0 收藏0