sass笔记

  1. 声明变量 通过$标识符进行命名及引用
  2. 混合器 类似vue中的函数 通过 @mixin标识定义 @include 标识调用
  3. & 父选择器标识
  4. @extend 进行继承
  5. 可嵌套
  6. 可导入 通过 @import '文件位置’ 、进行导入
<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>

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/44898.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

iOS textView支持超链接跳转

将某些文字变成高量可以点击的超链接核心功能代码 attri.addAttribute(NSAttributedString.Key.link, value:NSURL.init(string: "dctt:p/userPrivacy.html")!, range: NSRange.init(location: s.count - 4, length: 4) )textView.linkTextAttributes [NSAttributed…

CSS3基础

CSS3在CSS2的基础上增加了很多功能&#xff0c;如圆角、多背景、透明度、阴影等&#xff0c;以帮助开发人员解决一些实际问题。 1、初次使用CSS 与HTML5一样&#xff0c;CSS3也是一种标识语言&#xff0c;可以使用任意文本编辑器编写代码。下面简单介绍CSS3的基本用法。 1.1…

pdf 转 word

pdf 转 word 一、思路 直接调用LibreOffice 命令进行文档转换的命令行工具 使用的前系统中必须已经安装了 libreofficelibreoffice已翻译的用户界面语言包: 中文 (简体)libreoffice离线帮助文档: 中文 (简体)上传字体 重点&#xff1a;重点&#xff1a;重点&#xff1a; 亲…

flutter:webview_flutter和flutter_inappwebview的简单使用

前言 最近在研究如何在应用程序中嵌入Web视图&#xff0c;发现有两个库不错。 一个是官方维护、一个是第三方维护。因为没说特别的需求&#xff0c;就使用了官方库&#xff0c;实现一些简单功能是完全ok的 webview_flutter 不建议使用&#xff0c;因为效果不怎么样&#xf…

网站老域名跳转到新域名有哪些方法?内网穿透内网主机让外网访问

在网站服务器变更及本地主机搭建时&#xff0c;我们经常会遇到老域名地址跳转到新URL的配置&#xff0c;一些朋友还会面对无公网IP让外网访问的问题。今天我们来了解下网站老域名跳转到新域名有哪些方法&#xff0c;以及如何通过内网穿透实现内网主机让外网访问。 网站老域名跳…

js ajax 国内快速 映像

ajax 快速 映像 https://www.bootcdn.cn/ axios入门和axios基本请求方式 https://blog.csdn.net/m0_68997646/article/details/127438174 使用 jsDelivr CDN: <script src"https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>因为我们国…

关于vant2 组件van-dropdown-item,在IOS手机上,特定条件下无法点击问题的探讨

情景重现 先贴有问题的代码 <template><div :class"showBar ? homeContain : homeContain-nobar"><div class"contant" id"content"><van-dialog v-model"loading" :before-close"onBeforeClose" :…

git merge规则

参考文档&#xff1a;https://juejin.cn/post/7129333439299321887 丹尼尔&#xff1a;Hi&#xff0c;蛋兄&#xff0c;周杰伦都出新专辑了&#xff0c;你咋还不更新啊&#xff0c;真的打算半年一更啊&#xff1f; 蛋先生&#xff1a;好像确实是这样&#xff0c;要不&#xff0…

不要着急购买iPhone 15,先看看这5点再做决定吧!

人们对下个月可能推出的iPhone 15感到兴奋,这是有充分理由的——有传言称,新机型正在做出一些重大改变,尤其是在iPhone 15 Pro机型方面。从四款新iPhone都采用USB-C,到iPhone 15 Pro Max采用潜望镜式长焦镜头以实现更好的变焦,听起来有很多功能值得兴奋。 当然,除非你没…

OpenCV图片校正

OpenCV图片校正 背景几种校正方法1.傅里叶变换 霍夫变换 直线 角度 旋转3.四点透视 角度 旋转4.检测矩形轮廓 角度 旋转参考 背景 遇到偏的图片想要校正成水平或者垂直的。 几种校正方法 对于倾斜的图片通过矫正可以得到水平的图片。一般有如下几种基于opencv的组合方…

探索Chevereto图床:使用Docker Compose快速搭建个人图床

家人们!图片在今天的社交媒体、博客和论坛中扮演着至关重要的角色。然而&#xff0c;随着图片数量的增加&#xff0c;寻找一个可靠的图片托管解决方案变得越来越重要。Chevereto图床是一个备受赞誉的解决方案&#xff0c;而使用Docker Compose搭建它更是一种高效、可维护的方法…

UE4中关于利用粒子系统做轨迹描绘导致系统流畅性下降的问题

UE4中关于利用粒子系统做轨迹描绘导致系统流畅性下降的问题 文章目录 UE4中关于利用粒子系统做轨迹描绘导致系统流畅性下降的问题前言假设及验证1. 过多的粒子发射器影响仿真系统2. 粒子数目太多&#xff0c;降低粒子发射频率&#xff0c;同时增大粒子显示范围3. 把信息输出到屏…

matlab 点云最小二乘拟合空间直线(方法一)

目录 一、算法原理1、空间直线2、最小二乘法拟合二、代码实现三、结果展示四、可视化参考本文由CSDN点云侠原创,原文链接。如果你不是在点云侠的博客中看到该文章,那么此处便是不要脸的爬虫。 一、算法原理 1、空间直线 x

基于 Vercel TiDB Serverless 的 chatbot

作者&#xff1a; shiyuhang0 原文来源&#xff1a; https://tidb.net/blog/7b5fcdc9 # 前言 TiDB Serverless 去年就有和 Vercel 的集成了&#xff0c;同时还有一个 bookstore template 方便大家体验。但个人感觉 bookstore 不够炫酷&#xff0c;借 2023 TiDB hackthon 的…

07_缓存预热缓存雪崩缓存击穿缓存穿透

缓存预热&缓存雪崩&缓存击穿&缓存穿透 一、缓存预热 提前将数据从数据库同步到redis。 在程序启动的时候&#xff0c;直接将数据刷新到redis懒加载&#xff0c;用户访问的时候&#xff0c;第一次查询数据库&#xff0c;然后将数据写入redis 二、缓存雪崩 发生情…

【排排站:探索数据结构中的队列奇象】

本章重点 队列的概念及结构 队列的实现方式 链表方式实现栈接口 队列面试题 一、队列的概念及结构 队列&#xff1a;只允许在一端进行插入数据操作&#xff0c;在另一端进行删除数据操作的特殊线性表&#xff0c;队列具有先进先出 FIFO(First In First Out) 入队列&#x…

“RFID与光伏板的完美融合:探索能源科技的新时代!“

随着科技的不断发展&#xff0c;人类创造出了许多令人惊叹的发明。其中&#xff0c;RFID&#xff08;Radio Frequency Identification&#xff09;技术的应用在各个领域日益广泛。最近的研究表明&#xff0c;将RFID技术应用于光伏板领域&#xff0c;不仅可以提高光伏板的效率&a…

JVM中分代回收机制

为什么要分为新生代和老年代&#xff1f; 分为新生代&#xff08;Young Generation&#xff09;和老年代&#xff08;Old Generation&#xff09;是为了更有效地管理和优化内存的使用。 新生代主要存放生命周期较短的对象&#xff0c;例如方法的局部变量、临时变量等。由于这…

【Golang系统开发】搜索引擎(2) 压缩词典

写在前面 这篇文章我们就给出一系列的数据结构&#xff0c;使得词典能达到越来越高的压缩比。当然&#xff0c;和倒排索引记录表的大小相比&#xff0c;词典只占据了非常小的空间。那么为什么要对词典进行压缩呢&#xff1f; 这是因为决定信息检索系统的查询响应时间的一个重…

李沐pytorch学习-卷积网络及其实现

一、卷积概述 1.1 基本定义 卷积计算过程如图1所示&#xff0c;即输入矩阵和核函数&#xff08;filter&#xff09;对应的位置相乘&#xff0c;然后相加得到输出对应位置的数。 图1. 卷积计算过程 该过程可以形象地从图2中展现。 图2. 二维卷积示意图 1.2 实现互相关运算的代…