当前位置: 首页 > news >正文

less 笔记

<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="https://cdn.jsdelivr.net/npm/less@4" ></script>

变量(Variables)

原生已支持 --前缀定义属性 var() 函数获取变量值
原生缺点 不能直接外部定义全局变量

@ 前缀定义变量
使用是 直接用变量名

变量可直接参与算术运算

混合(Mixins)

原生只能通过类的方式来组合样式规则,
对于常用组合,要么复制样式创建一个类,要么对应添加类名的组合

将一组属性从一个规则集包含(或混入)到另一个规则集的方法

使用 类选择器() or id选择器() 方式 混入到新的规则集,避免重复书写

* {#idName();.className();
}

嵌套(Nesting)

原生已完全支持
原生缺点 直接标签的嵌套 需要加 & 前缀 才能生效

@规则嵌套和冒泡

@ 规则会被放在前面,同一规则集中的其它元素的相对顺序保持不变。

避免了在规则内部 重新书写选择器的麻烦

运算(Operations)

原生已部分支持 calc 函数 使用任意 <length>

算术运算符在加、减或比较之前会进行单位换算。计算的结果以最左侧操作数的单位类型为准。
如果单位换算无效或失去意义,则忽略单位。
还可以对颜色进行算术运算 需要加括号
(#224488 / 2)

转义(Escaping)

允许你使用任意字符串作为属性或变量值

~"str"

在 Less 3.5+ 版本中,许多以前需要“引号转义”的情况就不再需要了。

函数(Functions)

逻辑函数、转换颜色、处理字符串、算术运算等

each 函数

遍历 list 并生成规则
@value, @key, and @index
在选择器和属性名中的写法 @{value}, @{key}, and @{index}

range 函数

生成 数字 list

函数手册

命名空间和访问符

#空间名() {
}

可以指定命名空间下的类或id进行混入,避免命名冲突

#空间名.button();

映射(Maps)

从 Less 3.5 版本开始,你还可以将混合(mixins)和规则集(rulesets)作为一组值的映射(map)使用。

#colors() {primary: blue;secondary: green;
}
color: #colors[primary];

可以理解为创建了枚举变量

作用域(Scope)

首先在本地查找变量和混合(mixins),如果找不到,则从“父”级作用域继承。

注释(Comments)

支持 js 的 // 行注释

导入(Importing)

可以导入一个 .less 文件,此文件中的所有变量就可以全部使用了。如果导入的文件是 .less 扩展名,则可以将扩展名省略掉

@import "library";

相关文章:

less 笔记

<link rel"stylesheet/less" type"text/css" href"styles.less" /> <script src"https://cdn.jsdelivr.net/npm/less4" ></script>变量&#xff08;Variables&#xff09; 原生已支持 --前缀定义属性 var() 函数获取…...

Java中的异常你了解多少?

目录 一.认识异常二.异常分类三.异常的分类1.编译时异常2.运行时异常 四.异常的处理1.LYBL&#xff1a;事前防御型2.EAFP&#xff1a;事后认错型 五.异常的抛出Throw注意事项 六.异常的捕获1.异常的捕获2.异常声明throws3.try-catch捕获并处理 七.自定义异常 一.认识异常 在Jav…...

查找算法及哈希表

1 二分查找 1.1 重要概念 拟解决的问题&#xff1a;判断某个区间是否包含某个元素&#xff0c;无法确定区间中包含重复元素的具体位置&#xff1b;使用条件&#xff1a;查找的区间必须符合单调性&#xff1b;本质&#xff1a;采用分治思想&#xff0c;将某个单调区间一分为二…...

ELK分布式日志管理平台部署

目录 一、ELK概述 1、ELK概念&#xff1a; 2、其他数据收集工具&#xff1a; 3、ELK工作流程图&#xff1a; 4、ELK 的工作原理&#xff1a; 5、日志系统的特征&#xff1a; 二、实验部署&#xff1a; 1、ELK Elasticsearch 集群部署 2、安装 Elasticsearch-head 插件 …...

四、虚拟机网络配置

目录 1、VMware网卡配置模式 1.1 桥接模式 1.2 NAT模式 1.3 仅主机模式 ​​​​​​​2、编辑虚拟机的网络编辑器 ​​​​​​​3、编辑Window的虚拟网卡 ​​​​​​​4、修改IP地址为静态 4.1 查看网卡名字 4.2 编辑修改网卡IP地址的配置文件 4.3 重启网络: 4.…...

四、Lua循环

文章目录 一、while(循环条件)二、for&#xff08;一&#xff09;数值for&#xff08;二&#xff09;泛型for&#xff08;三&#xff09;repeat util 既然同为编程语言&#xff0c;那么控制逻辑里的循环就不能缺少&#xff0c;它可以帮助我们实现有规律的重复操作&#xff0c;而…...

生成对抗网络(GAN)手写数字生成

文章目录 一、前言二、前期工作1. 设置GPU&#xff08;如果使用的是CPU可以忽略这步&#xff09; 二、什么是生成对抗网络1. 简单介绍2. 应用领域 三、网络结构四、构建生成器五、构建鉴别器六、训练模型1. 保存样例图片2. 训练模型 七、生成动图 一、前言 我的环境&#xff1…...

LeetCode Hot100 31.下一个排列

题目&#xff1a; 整数数组的一个 排列 就是将其所有成员以序列或线性顺序排列。 例如&#xff0c;arr [1,2,3] &#xff0c;以下这些都可以视作 arr 的排列&#xff1a;[1,2,3]、[1,3,2]、[3,1,2]、[2,3,1] 。 整数数组的 下一个排列 是指其整数的下一个字典序更大的排列…...

Redis主从与哨兵架构详解

目录 主从架构 主从环境搭建 主从复制流程 1. 全量复制 2. 部分复制 主从风暴 哨兵架构 概念 哨兵环境搭建 主从架构 主从环境搭建 1. 复制一份redis.conf文件, 修改下面几行配置 port 6380 pidfile /var/run/redis_6380.pid logfile "6380.log" dir /usr/…...

Linux:docker的数据管理(6)

数据管理操作*方便查看容器内产生的数据 *多容器间实现数据共享 两种管理方式数据卷 数据卷容器 1.数据卷 数据卷是一个供容器使用的特殊目录&#xff0c;位于容器中&#xff0c;可将宿主机的目录挂载到数据卷上&#xff0c;对数据卷的修改操作立刻可见&#xff0c;并且更新数…...

深入理解Zookeeper系列-1.初识Zoookeeper

&#x1f44f;作者简介&#xff1a;大家好&#xff0c;我是爱吃芝士的土豆倪&#xff0c;24届校招生Java选手&#xff0c;很高兴认识大家&#x1f4d5;系列专栏&#xff1a;Spring源码、JUC源码、Kafka原理、分布式技术原理&#x1f525;如果感觉博主的文章还不错的话&#xff…...

芯片技术探索:了解构芯片的设计与制造之旅

芯片技术探索:了解构芯片的设计与制造之旅 一、引言 随着现代科技的飞速发展,芯片作为信息技术的核心,已经渗透到我们生活的方方面面。从智能手机、电视、汽车到医疗设备和工业控制系统,芯片在各个领域都发挥着至关重要的作用。然而,对于大多数人来说,芯片仍然是一个神秘…...

STM32 超声波模块(HC-SR04)

HC-SR04介绍 典型工作电压&#xff1a;5v &#xff08;如果你的超声波模块没有工作&#xff0c;可以看一下是不是电压不够&#xff09;超小静态工作电流&#xff1a;<2mA 感应角度&#xff1a;<15 &#xff08;超声波模块&#xff0c;是一个范围式的探…...

ELK+Filebeat

Filebeat概述 1.Filebeat简介 Filebeat是一款轻量级的日志收集工具&#xff0c;可以在非JAVA环境下运行。 因此&#xff0c;Filebeat常被用在非JAVAf的服务器上用于替代Logstash&#xff0c;收集日志信息。实际上&#xff0c;Filebeat几乎可以起到与Logstash相同的作用&…...

MySql之锁表、锁行解决方案

查询正在使用的表&#xff0c;没有跑业务&#xff0c;一般情况下是锁表了 show open tables where in_use > 0 ;查看进程&#xff0c;可以看到Command类型&#xff08;Sleep为阻塞线程&#xff09; show processlist;kill事务&#xff0c;kill 进程Id kill 8193583;其他 …...

2023年第十六届山东省职业院校技能大赛中职组“网络安全”赛项竞赛正式试题

第十六届山东省职业院校技能大赛中职组 “网络安全”赛项竞赛试题 目录 一、竞赛时间 二、竞赛阶段 三、竞赛任务书内容 &#xff08;一&#xff09;拓扑图 &#xff08;二&#xff09;A模块基础设施设置/安全加固&#xff08;200分&#xff09; &#xff08;三&#xf…...

JAVA 整合 AWS S3(Amazon Simple Storage Service)文件上传,分片上传,删除,下载

依赖 因为aws需要发送请求上传、下载等api&#xff0c;所以需要加上httpclient相关的依赖 <dependency><groupId>com.amazonaws</groupId><artifactId>aws-java-sdk-s3</artifactId><version>1.11.628</version> </dependency&…...

记录:Unity脚本的编写9.0

目录 射线一些准备工作编写代码 突然发现好像没有写过关于射线的内容&#xff0c;我就说怎么总感觉好像少了什么东西&#xff08;心虚 那就在这里写一下关于射线的内容吧&#xff0c;将在这里实现射线检测鼠标点击的功能 射线 射线是一种在Unity中检测碰撞器或触发器的方法&am…...

共享单车停放(简单的struct结构运用)

本来不想写这题的&#xff0c;但是想想最近沉迷玩雨世界&#xff0c;班长又问我这题&#xff0c;就草草写了一下 代码如下&#xff1a; #include<stdio.h> #include<math.h> struct parking{int distance;int remain;int speed;int time;int jud; }parking[50]; …...

【Java8系列07】Java8日期处理

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…...

别只看显存!租GPU跑AI模型,这5个隐藏参数才是省钱关键

别只看显存&#xff01;租GPU跑AI模型&#xff0c;这5个隐藏参数才是省钱关键 当你在租赁平台上看到两款价格相近的24GB显存显卡时&#xff0c;是否曾困惑为何实际训练速度相差30%以上&#xff1f;显存容量只是GPU性能的冰山一角&#xff0c;真正影响性价比的往往是那些产品页面…...

WzComparerR2:解锁冒险岛游戏数据洞察的专业工具

WzComparerR2&#xff1a;解锁冒险岛游戏数据洞察的专业工具 【免费下载链接】WzComparerR2 Maplestory online Extractor 项目地址: https://gitcode.com/gh_mirrors/wz/WzComparerR2 想要深入探索《冒险岛》这款经典游戏的数据世界吗&#xff1f;WzComparerR2是您的专…...

OpenClaw+千问3.5-9B智能家居:自然语言控制HomeAssistant

OpenClaw千问3.5-9B智能家居&#xff1a;自然语言控制HomeAssistant 1. 为什么需要自然语言控制智能家居&#xff1f; 去年装修新房时&#xff0c;我安装了HomeAssistant系统来控制全屋灯光、空调和窗帘。虽然手机App能实现远程控制&#xff0c;但每次都要打开应用、找到对应…...

Infinity Pro书签迁移终极指南:从JSON文件到本地缓存的完整操作流程

Infinity Pro书签迁移终极指南&#xff1a;从JSON文件到本地缓存的完整操作流程 作为一名长期使用Infinity Pro的开发者&#xff0c;我深知书签迁移的痛点。每次换设备或重装系统&#xff0c;那些精心整理的技术资源库都要重新配置。本文将分享一套经过实战验证的迁移方案&…...

成为技术专家的捷径?不,只有长期主义的坚持

在软件测试领域&#xff0c;我们常常被一种“速成”的幻象所包围。铺天盖地的培训广告承诺“三个月精通自动化测试”、“六周成为性能测试专家”&#xff0c;各种“一招鲜”的测试工具和“万能”的测试框架被包装成通往成功的捷径。对于身处其中、渴望突破职业瓶颈的测试工程师…...

数字孪生+AI:某国家级技术科研机构:耦合仿真评估部件性能,长期运维监测承压状态

部件仿真&#xff5c;设备安全&#xff5c;能源装备&#xff5c;风险评估 某国家级技术科研机构长期服务于国家级重点工程与大型产业体系&#xff0c;在复杂系统运行保障、风险评估与技术支撑等方面承担着关键角色。其业务覆盖多类型基础设施与工程场景&#xff0c;具备完善的…...

新手福音:在快马平台开启你的云端代码编程第一课

作为一名刚接触编程的新手&#xff0c;我最近发现了一个特别适合入门的学习方式——云端代码编程。以前总觉得学编程要先装一堆软件、配置环境&#xff0c;光是这些准备工作就能劝退不少人。但在InsCode(快马)平台上&#xff0c;这些烦恼都不存在了。 零门槛的编程初体验 打开平…...

Java八股文实践篇:从理论到DeOldify项目中的设计模式应用

Java八股文实践篇&#xff1a;从理论到DeOldify项目中的设计模式应用 每次面试被问到设计模式&#xff0c;是不是都只能背出“单例模式确保一个类只有一个实例”这样的标准答案&#xff1f;背得滚瓜烂熟&#xff0c;但一上手写代码&#xff0c;还是觉得这些模式离自己很远&…...

C++的std--ranges容错系统

C的std::ranges容错系统&#xff1a;现代编程的稳健之道 在C20标准中&#xff0c;std::ranges库的引入彻底改变了算法与容器的交互方式&#xff0c;其容错机制为开发者提供了更安全、更灵活的编程体验。传统迭代器容易因越界或无效操作导致未定义行为&#xff0c;而std::range…...

VisualGDB跨平台调试避坑指南:用VS远程调试Linux程序(2023最新版配置)

VisualGDB跨平台调试实战&#xff1a;2023年VS远程开发Linux程序避坑指南 当Visual Studio开发者首次尝试在Linux环境下进行C开发时&#xff0c;往往会面临调试工具链断裂的困境。传统的gdb命令行调试方式与Windows开发者熟悉的图形化调试体验存在巨大鸿沟&#xff0c;而Visual…...