sass笔记

  1. 声明变量 通过$标识符进行命名及引用
  2. 混合器 类似vue中的函数 通过 @mixin标识定义 @include 标识调用
  3. & 父选择器标识
  4. @extend 进行继承
  5. 可嵌套
  6. 可导入 通过 @import '文件位置' 、进行导入
js 复制代码
<style>
//1 声明变量
$name: 15px;
$color: skyblue;

@mixin border-radius($num) {
  //2 类似函数
  border-radius: $num;
}
.aa {
//1 使用变量
  height: $name !important;
  background: $color !important;
  big {
    color: $color;
    font-size: 30px;
    font-weight: 700;
    & {  //3 
      width: 50px;
      background: purple;
    }

    @include border-radius(50%); // 2 调用函数
  }
}
.a2 {
  @extend .aa; //4 继承 
  margin-left: 500px;
}
</style>


<template>
  <div class="aa">
    <big>123</big>
  </div>
  <small class="a2">456</small>
</template>
相关推荐
该用户已不存在16 小时前
Mojo vs Python vs Rust: 2025年搞AI,该学哪个?
后端·python·rust
大卫小东(Sheldon)18 小时前
写了一个BBP算法的实现库,欢迎讨论
数学·rust
_落纸1 天前
三大基础无源电子元件——电阻(R)、电感(L)、电容(C)
笔记
echoarts1 天前
Rayon Rust中的数据并行库入门教程
开发语言·其他·算法·rust
Alice-YUE1 天前
【CSS学习笔记3】css特性
前端·css·笔记·html
2303_Alpha1 天前
SpringBoot
笔记·学习
ftpeak1 天前
从零开始使用 axum-server 构建 HTTP/HTTPS 服务
网络·http·https·rust·web·web app
Hello_Embed1 天前
STM32HAL 快速入门(二十):UART 中断改进 —— 环形缓冲区解决数据丢失
笔记·stm32·单片机·学习·嵌入式软件
咸甜适中1 天前
rust语言 (1.88) 学习笔记:客户端和服务器端同在一个项目中
笔记·学习·rust
Grassto1 天前
RAG 从入门到放弃?丐版 demo 实战笔记(go+python)
笔记