sass基本使用

本文介绍了Sass的基本用法,包括如何定义和使用带默认值的变量,创建及调用混合器(mixin),以及利用@extend实现选择器继承以简化CSS代码。通过这些特性,Sass能够提升CSS的组织效率和可维护性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、变量定义 !default
在这里插入图片描述
在变量的结尾添加 !default 给一个未通过 !default 声明赋值的变量赋值,此时,如果变量已经被赋值,不会再被重新赋值,但是如果变量还没有被赋值,则会被赋予新的值
变量是 null 空值时将视为未被 !default 赋值
在这里插入图片描述
2、混合器
在这里插入图片描述
用@mixin 定义内容 用 @include 调用内容

编译后
在这里插入图片描述
混合器也支持基本语法
在这里插入图片描述
给混合器传参
在这里插入图片描述
混合器可以像方法一样传参 、翻译后
在这里插入图片描述
3、使用选择器继承来精简CSS
在这里插入图片描述
用 @extend 继承
编译后
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值